Сделать ширину столбца одинаковой для 2 таблиц

Question

Я пытаюсь реализовать структуру таблицы, в которой заголовок остается фиксированным при прокрутке вниз.Я использовал 2 таблицы для этой цели.Первая таблица имеет значения заголовка, а вторая таблица имеет соответствующие данные (длина данных в каждом столбце может варьироваться, поскольку данные заполняются динамически).Проблема в том, что ширина заголовка и ширина столбца данных не совпадают точно.Я написал некоторый код, как показано ниже, для динамического изменения ширины столбца

$('#tdCheckAllBody').width($('#tdCheckAllHead').width());
$('#tdLoginBody').width($('#tdLoginHead').width());
$('#tdStatusBody').width($('#tdStatusHead').width());
$('#tdFNameBody').width($('#tdFNameHead').width());
$('#tdLNameBody').width($('#tdLNameHead').width());
$('#tdCompBody').width($('#tdCompHead').width());

Но, похоже, он не работает должным образом.Любая помощь приветствуется.

Answer 1

Для этого создал рабочую скрипку: http://jsfiddle.net/terjeto/dx7H5/

Конечно, если ваш случай отличается, вам, возможно, придется немного подправить.На мой взгляд, проблемными областями являются, если таблица использует динамическую или% ширину и справляется с «автоматической» полосой прокрутки, которая занимает около 18 пикселей, и, конечно, если таблице нужны горизонтальные полосы прокрутки, это усложняет некоторые вещи, требующие события onscroll.

Может быть, ваш пример не точный из-за отсутствия кода reset-css?Я использую это: http://developer.yahoo.com/yui/reset/

Answer 2

Используйте этот метод $(window).scroll(function(){<br> $("#id of the table header").offset({top:$("#id of the control which u placed the scrolling").scrollTop()});<br> });