javascript - DataTables plug-in - Display scrollbar below tfoot tag? -


i use jquery datatables plug-in , "scrollx":true horizontal scrolling.

why scroll bar appears above tfoot tag? how make appear below footer?

var table = $('#example')     .datatable(     {         "scrollx": true,         "scrollcollapse": true,         "dom": 'zlrtip',         "colresize": {             "tablewidthfixed": false,             //"handlewidth": 10,             "resizecallback": function(column)             {              }         },         "searching":   false,         "paging":   false,         "info":     false,         "deferrender": true,         "sscrollx": "190%"     }); 

see jsfiddle example demonstrating problem.

you need add following code datatables initialization options:

"fninitcomplete": function(){     // disable tbody scoll bars     $('.datatables_scrollbody').css({         'overflow': 'hidden',         'border': '0'     });      // enable tfoot scoll bars     $('.datatables_scrollfoot').css('overflow', 'auto');      // sync tfoot scrolling tbody     $('.datatables_scrollfoot').on('scroll', function () {         $('.datatables_scrollbody').scrollleft($(this).scrollleft());     });                     }, 

see updated jsfiddle demonstration.


Comments

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

javascript - Function overwritting -

php - Find a regex to take part of Email -