jQuery Plugin For Fixed Table Headers And Footers - eFreezeTable

Just another jQuery plugin that fixes your html tables' header (thead) and footer (tfoot) at the top of the screen when page scrolls down.

How to use it:

1. Add references to jQuery library and the jQuery eFreezeTable plugin's script into the html document.

<script src="jquery.min.js"></script>
<script src="eFreezeTable.js"></script>

2. Make sure your html table has the thead and tfoot elements.

<table id="table">
  <thead>
    ...
  </thead>
  <tfoot>
    ...
  </tfoot>
  <tbody>
    ...
  </tbody>
</table>

3. Initialize the plugin and make the table header stick to the top of the webpage.

$('#table').eFreezeTableHead();

4. Stick both table header and footer to the top of the webpage.

$('#table').eFreezeTableHeadFoot();

5. Override the default styles of table rows when getting stuck.

.efreezetable-container {
  width: 100%;
  margin: auto;
}

.efreezetable-fixed {
  background-color: #FFF;
  border: none;
  color: #000;
  display: none;
  position: fixed;
  top: 0;
  width: auto;
  z-index: 100;
}

---

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