jQuery Plugin For Scrollable Table With Fixed Header And Cols - Table Scroll
File Size: | 22.1 KB |
---|---|
Views Total: | 25810 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Table Scroll is a touch-enabled and configurable jQuery scrollable table plugin that adds vertical and horizontal scrolling capabilities to your complex large data table with floating thead
, tfoot
and fixed columns.
How to use it:
1. Add both jQuery and jQuery UI into your html file.
<script src="/path/to/jquery.min.js"></script> <script src="/path/to/jquery-ui.min.js"></script>
2. Include the jQuery table scroll plugin's files after jQuery.
<script src="table-scroll.min.js"></script>
3. Call the function on the table to make it scrollable with floating thead
and tfoot
.
$('table').table_scroll();
4. Plugin's default customization options.
$('table').table_scroll({ // Number of rows in table header. rowsInHeader: null, // Number of rows in table footer. rowsInFooter: null, // Number of columns at the left side of scrollable area that will not be scrolled fixedColumnsLeft: 0, // Number of columns at the right side of scrollable area that will not be scrolled fixedColumnsRight: 0, // Number of columns to scroll to scrollX: 0, // Number of rows to scroll to scrollY: 0, // Number of rows that remains visible in scrollable area rowsInScrollableArea: 10, // Number of columns that remains visible in scrollable area columnsInScrollableArea: 5, // scroll or auto overflowY: 'auto', overflowX: 'auto' });
This awesome jQuery plugin is developed by volodymyr-bobko. For more Advanced Usages, please check the demo page or visit the official website.