Tablesorter demo

All options included, as well as the uitheme widget

HTML

<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.blue.css">
<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.js"></script>
<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.widgets.js"></script>
<script src="//rawgit.com/Mottie/tablesorter/master/js/widgets/widget-scroller.js"></script>
<table id="fixed-columns-table">
    <thead>
        <tr>
            <th>Index</th>
            <th>First</th>
            <th>Last</th>
            <th>ID</th>
            <th>Address</th>
            <th>State</th>
            <th>Zip</th>
            <th>Telephone</th>
            <th>Email</th>
            <th>Notes</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>Index</th>
            <th>First Name</th>
            <th>Last Name</th>
            <th>ID</th>
            <th>Address</th>
            <th>State</th>
            <th>Zip</th>
            <th>Telephone</th>
            <th>Email</th>
            <th>Notes</th>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <td>1</td>
            <td>Sherry</td>
            <td>Mills</td>
            <td>456</td>
            <td>3792 Sit Rd</td>
            <td>NE</td>
            <td>69836</td>
            <td>(627) 124-8760</td>
            <td>[email protected]</td>
            <td>sagittis amet mattis facilisis vitae molestie nec dolor id sed</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Markella</td>
            <td>Lessenberry</td>
            <td>895</td>
            <td>5979 Sit Ln</td>
            <td>VA</td>
            <td>97761</td>
            <td>(768) 233-5399</td>
            <td>[email protected]</td>
            <td>elementum nullam lacus elit magna libero sed dolor pulvinar orci</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Lee</td>
            <td>Trenkelbach</td>
            <td>719</td>
            <td>5656 Adipiscing Ave</td>
           ...

CSS

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

#fixed-columns-table tbody td {
	/* force "Notes" column to not wrap, so we get a horizontal scrolling demo! (optional css) */
	white-space: nowrap;
	/* Add min column width, or "Index" column filter gets too narrow to use (optional css) */
	min-width: 60px;
}

div.tablesorter-scroller-fixed-panel {
    margin-top: 10px;
    margin-bottom: 14px;
    border-right: 2px solid black;
}

JavaScript

/* Documentation for this tablesorter FORK can be found at
 * http://mottie.github.io/tablesorter/docs/
 */
$(function () {
    $('#fixed-columns-table').tablesorter({
        theme: 'blue',
        showProcessing: true,
        headerTemplate: '{content}',
        widgets: ['zebra', 'filter', 'scroller'],
        widgetOptions: {
            scroller_height: 300,
            scroller_fixedColumns: 2,
            scroller_rowHighlight: 'hover'
        }
    });
});