jQuery表格上下滚动插件（Scrollable Table）

演示  website 下载

插件介绍

一个触摸友好的jQuery可滚动表插件，在跨设备web应用程序上呈现长HTML表时，它提供了更好的可读性并节省了屏幕空间。该插件将您的长HTML表缩小到特定高度（默认为视口高度的60%），用可视指示器替换原生浏览器滚动条，因此用户可以通过键盘箭头、鼠标滚轮和触摸滑动事件滚动HTML表。

兼容的浏览器

Chrome, IE9+, FireFox, Opera, Safari

使用方法

1.在页面中添加jQuery库和滚动插件样式文件和js文件。

<link rel="stylesheet" href="/path/to/jquery.tablebodyscroll.css" />
<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/jquery.tablebodyscroll.js"></script>

2. 初始化插件。

$(function(){
  $('table').TableBodyScroll();
});

3.指定表的最大高度。

$('table').TableBodyScroll({

  // 60%
  'height' : 60,

  // height unit
  'heightunit' : '%',

  // relative to the window
  'percentelem' : window
  
});

4. 在init上触发函数。

$('table').TableBodyScroll({
  'postinit': function(){
    // do something
  }

});