JS: Fixed Table Head
Небольшой пример фиксированной шапки таблицы. Без плагинов, библиотек и т.п. Только html, css, js. Демо.
Несомненный плюс написания собственноручных скриптиков, что получаются легковесные, лишь то что необходимо, и знакома каждая строка.
Таков и этот пример. Задача - оставлять шапку таблицы видимой, вверху, при скроллировании длинной таблицы.
На событие прокрутки навешиваю обработчик, который в зависимости от позиции прокрутки или добавляет класс к хедеру таблицы, или удаляет его.
Важно еще установить ширину ячеек, перед фиксацией, иначе шапка разъезжается.
Несомненный плюс написания собственноручных скриптиков, что получаются легковесные, лишь то что необходимо, и знакома каждая строка.
Таков и этот пример. Задача - оставлять шапку таблицы видимой, вверху, при скроллировании длинной таблицы.
На событие прокрутки навешиваю обработчик, который в зависимости от позиции прокрутки или добавляет класс к хедеру таблицы, или удаляет его.
Важно еще установить ширину ячеек, перед фиксацией, иначе шапка разъезжается.
.png) | |
| Фиксированная шапка таблицы. |
Документация: различные способы выяснения длины объекта. Крайне познавательно.
P.S тестировано в FF и хроме. Доберусь и до прочих.