sticky header

Untuk membuat header tabel yang sticky seperti gambar di atas, yang kita butuhkan adalah library jquery dan library jquery sticky header.

http://jquery-2.2.1.min.js
http://jquery.stickytableheaders.min_.js

Pada tabelnya, pastikan sudah kita pasang id yang sesuai:

<table id="tabel1">
    <thead>
  <tr>
    <th>Judul</th>
    <th>Pengarang</th>
    <th>Tutorial</th>
  </tr>
  </thead>

Kemudian tinggal kita panggil id tabel dengan kode berikut:

    $(document).ready(function() {
         $("#tabel1").stickyTableHeaders();
         $("#tabel2").stickyTableHeaders();
    });

Demikian, semoga bermanfaat!

Download source code di https://github.com/wisnurdi/Tutorial/tree/master/sticky_table_header

Sumber: PHPGang.com

Advertisements