Прокрутка tbody независимо от thead?

Хочется, чтобы при вертикальной прокрутке длинной таблицы, шапка с заголовками столбцов оставалась на месте.


Тема горячо обсуждается и по сей день. Мне удалось найти максимально простой и рабочий вариант без JS, но и он оказался рабочим только до тех пор, пока высота таблицы была фиксирована. Как только tbody {height: 100%;}, вся «фишка» пропадает.

Задачка для знатоков: jsfiddle.net/BxWyA
измените tbody {height: на 100%}; и попробуйте добиться первоначального эффекта.


Конечно хочется без JS. Но если у Вас на примете есть простое решение c JS, то варианты будут уместны.

Заранее благодарю!
  • Вопрос задан
  • 16148 просмотров
Решения вопроса 1
Вариант с JS (проверял в: Chrome 26, IE 10, FF 3.6)
jsfiddle.net/npu9r/
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
Stalker_RED
@Stalker_RED
Возможно я неправильно понял, что именно вы хотите получить, но закрепить заголовок при помощи position: fixed не вариант?
http://jsfiddle.net/hZajC/
Ответ написан
Как можно прокручивать то, что полностью влезает на страницу?!
Обрамите таблицу любым блоком с ограничением по высоте и все заработает: jsfiddle.net/mynBk/
Ответ написан
@gribchic
все решения не решения. поскольку заголовок таблицы во всех приведенных решениях оторван от тела таблицы, в результате чего ширины ячеек заголовка не совпадают с ширинами ячеек тела. убедиться в этом можно просто заменив во всех примерах строку скрипта:
var row = $("").html(a + " + " + b + " ="))
на:
var row = $("").html(a))
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы