Example 1
| Name | Type | Default | Description |
|---|---|---|---|
| position | string | 'auto' | Valid values: 'auto', 'fixed', 'absolute'.Position the floated header using absolute or fixed positioning mode (auto picks best for your table scrolling type). Try switching modes if you encounter layout problems. |
| scrollContainer | function or true |
null | Defines a container element inside of which the table scrolls vertically and/or horizontally. If boolean true is used, then we use the table's offsetParent. |
| responsiveContainer | function | null | Defines a responsive container element inside of which the table scrolls horizontally (at some resolutions), everything else behaves like window scrolling. This option cannot be used together with scrollContainer option. |
| headerCellSelector | string | tr:first>th:visible | Specifies the selector used to find header cells (in the table's thead element) |
| floatTableClass | string | floatThead-table | This class is added to the table element after you run floatThead on it |
| floatContainerClass | string | floatThead-container | This class is added to the container div inside of which your thead will spend time floating |
| top | number or function | 0 | Offset from the top of the window where the floating header will 'stick' when scrolling down |
| bottom | number or function | 0 | Offset from the bottom of the window where the floating header will 'stick' when scrolling down |
| zIndex | number | 1001 | z-dashboard_v1 of the floating header |
| debug | boolean | false | Point out various possible issues via console.log if it is available |
| getSizingRow | function | undefined |
Used by IE Only If your table's first visible row (tbody tr:visible:first>*) contains td or th elements with colspans, then you need to return another set of cells which have no colspans. In other words the selector should return the same number of cells as columns in your table. In depth docs
|
| copyTableClass | boolean | true | Should the table's class attribute be copied to the floated table? This make the styles written for the table's class selector apply also to the floated header. However, if you are later selecting this table by class you may be surprised to find 2 tables. |
| enableAria | boolean | false | Copy the floated header's text back into original table for screen readers. This may cause css layout issues because that text might be styled in unforeseen ways. (aria-* attributes are always used even when set to false). |
| autoReflow | boolean | false |
Experimental use MutationObserver (on good browsers) to reflow automatically when internal table DOM changes, or DOM withinscrollContainer
|
Example 2
| Name | Phone | Mobile | |
|---|---|---|---|
| isaiah morgan | isaiah.morgan50@example.com | (892)-322-1767 | (177)-767-9275 |
| evelyn cooper | evelyn.cooper69@example.com | (425)-779-2136 | (424)-467-5545 |
| mason martin | mason.martin65@example.com | (149)-890-9325 | (906)-475-4308 |
| alexander hamilton | alexander.hamilton19@example.com | (306)-140-4527 | (792)-168-5014 |
| dennis nelson | dennis.nelson55@example.com | (815)-876-6449 | (795)-652-4660 |
| thomas hayes | thomas.hayes24@example.com | (358)-195-5812 | (604)-195-8025 |
| zoey parker | zoey.parker17@example.com | (544)-275-6534 | (788)-994-6843 |
| meghan cooper | meghan.cooper47@example.com | (981)-986-8806 | (872)-260-8143 |
| richard mitchelle | richard.mitchelle41@example.com | (372)-385-4079 | (649)-916-5614 |
| mason green | mason.green14@example.com | (540)-641-3985 | (748)-678-9603 |
| isaiah morgan | isaiah.morgan50@example.com | (892)-322-1767 | (177)-767-9275 |
| evelyn cooper | evelyn.cooper69@example.com | (425)-779-2136 | (424)-467-5545 |
| mason martin | mason.martin65@example.com | (149)-890-9325 | (906)-475-4308 |
| alexander hamilton | alexander.hamilton19@example.com | (306)-140-4527 | (792)-168-5014 |
| dennis nelson | dennis.nelson55@example.com | (815)-876-6449 | (795)-652-4660 |
| thomas hayes | thomas.hayes24@example.com | (358)-195-5812 | (604)-195-8025 |
| zoey parker | zoey.parker17@example.com | (544)-275-6534 | (788)-994-6843 |
| meghan cooper | meghan.cooper47@example.com | (981)-986-8806 | (872)-260-8143 |
| richard mitchelle | richard.mitchelle41@example.com | (372)-385-4079 | (649)-916-5614 |
| mason green | mason.green14@example.com | (540)-641-3985 | (748)-678-9603 |
| isaiah morgan | isaiah.morgan50@example.com | (892)-322-1767 | (177)-767-9275 |
| evelyn cooper | evelyn.cooper69@example.com | (425)-779-2136 | (424)-467-5545 |
| mason martin | mason.martin65@example.com | (149)-890-9325 | (906)-475-4308 |
| alexander hamilton | alexander.hamilton19@example.com | (306)-140-4527 | (792)-168-5014 |
| dennis nelson | dennis.nelson55@example.com | (815)-876-6449 | (795)-652-4660 |
| thomas hayes | thomas.hayes24@example.com | (358)-195-5812 | (604)-195-8025 |
| zoey parker | zoey.parker17@example.com | (544)-275-6534 | (788)-994-6843 |
| meghan cooper | meghan.cooper47@example.com | (981)-986-8806 | (872)-260-8143 |
| richard mitchelle | richard.mitchelle41@example.com | (372)-385-4079 | (649)-916-5614 |
| mason green | mason.green14@example.com | (540)-641-3985 | (748)-678-9603 |