Animated Sticky Table Header Plugin With jQuery - tableheadfixer

File Size: 9.7 KB
Views Total: 3933
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Animated Sticky Table Header Plugin With jQuery - tableheadfixer

tableheadfixer is a really simple jQuery plugin that makes table header (thead) always sticky on top of the page when scrolling down.

How to use it:

1. To get started, you first need to include the jQuery tableheadfixer plugin after jQuery JavaScript library has been loaded.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.tableheadfixer.min.js"></script>

2. Then call the .tableHeadFixer() function on your html table and done.

$('#table-demo').tableHeadFixer();

3. Configuration options available.

$('#table-demo').tableHeadFixer({

  // background color of table's thead
  'bgColor'   : '#eee',

  // z-index
  'z-index'   : '0', 

  // custom animation using CSS3 transition
  'transition': 'all 1s'
  
});

Change log:

2015-12-04

  • fix scroll top

2015-12-02

  • optimise code

This awesome jQuery plugin is developed by 90arther. For more Advanced Usages, please check the demo page or visit the official website.