jquerycsshtml-tablestickyfixed-header-tables

Sticky Table Headers & Columns - Two fixed columns

I'm using the plugin Sticky Table Headers & Columns in a table. The plugin works perfectly. My question is how to let the second column fixed. I searched the documentation and tried to contact the author, but it still fails.

I also tried adding another <th>Sample #2</th>, but a white block appears at the top of the column when you scrolls, as you can see here.

I think I'm very close to the solution. Could anyone help me with this problem?

Solved: jsfiddle.net/tyanxbbs/8

Solution

  • In jquery.stickyheader.js edit the below line and try.

    $stickyInsct.html('<thead><tr><th>'+$t.find('thead th:first-child').html()+'</th></tr></thead>');

    to 

    $stickyInsct.html('<thead><tr><th>'+$t.find('thead th:first-child').html()+'</th><th>'+$t.find('thead th:eq(1)').html()+'</th></tr></thead>');

    update the below line too. I just changed from 0 to 1.

    $stickyCol.append($col)
                .find('thead th:gt(1)').remove()
                .end()
                .find('tbody td').remove();