0

我正在尝试启用datatable并应用slimScroll它的滚动选项以使滚动条看起来圆滑。到目前为止，我得到了我想做的事情。

很快我就意识到，“如果用户重新调整窗口大小会怎样？”。由于 datatable 和 slimScroll 的设置都配置了固定值，因此 data-table 的高度不会根据视口大小进行调整。

我试图在$(window).resize()事件的帮助下解决这个问题，但它不起作用。我不擅长 JavaScript 编程。我可能做错了什么，或者必须有其他方法。这是我到目前为止写的代码。

   //Data table
   var table = $('#material-content').DataTable({
       'paging'    : false,
       'info'      : false,
       'order'     : [[1, 'desc']],
       "scrollY"   : $(window).height()*0.46    // want to have 46% of viewport
   });

   // scrolling

   var scroller =  $('.dataTables_scrollBody').slimScroll({
           "height": $(window).height()*0.46
       });


   $(window).resize(function () {
       var tableSettings    = table.fnSettings(); // ERROR says: Uncaught TypeError: undefined is not a function
       var scrollerSettings = scroller.fnSettings();

       tableSettings.scrollY = $(window).height()*0.46;
       scrollerSettings.height = $(window).height()*0.46;

       tableSettings.fnDraw();
       scrollerSettings.fnDraw();
   });
4

0 回答 0