Fork me on GitHub

Using with Perfect-Scrollbar

This plugin now supports (as of v1.2.11 or current master) https://github.com/noraesae/perfect-scrollbar v0.5.8 or better
Because perfect-scrollbar needs a container in order to work, this plugin only supports it when used with the scrollContainer option.

You must init perfect-scrollbar on the same container that is returned from the scrollContainer function:

var $container = $('.widget .scroll-container');
var $table = $('.widget table');

$container.perfectScrollbar();

$table.floatThead({
    scrollContainer: function ($table) {
        return $container;
    }
});
You will still need to trigger the reflow event on the table and call the update method on the scrollbar whenever the DOM changes - this plugin does not do that for you.

You may also want to add a css style that will make scrollbar render on top of the header (like it would if you didnt use this plugin):

<style type="text/css">
    .ps-container>.ps-scrollbar-y-rail {
        z-index: 1002;
    }
</style>

Demo:

Agreement Name Type Status Cur Balance Total
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00
300102 Advania CARPRE Open ISK 356.00 $10,546.00