Пример верстки для обозначения сути вопроса:
spoiler<style>
html, body
{
margin: 0;
padding: 0;
}
table
{
border-collapse: collapse;
background-color: #fff;
}
table,
table td,
table th
{
border: 1px solid #333;
}
div.table_container>div.fixed_table_container
{
position: fixed;
overflow: hidden;
top: 0;
height: 44px; /* это значение устанавливается программно, равно высоте thead ориг. таблицы */
width: 100%;
}
</style>
<div class="table_container">
<table id="t1" class="example_table"> <!-- Оригинальная таблица -->
<thead>
<tr><th colspan="4">Заголовок</th></tr>
<tr><th>Колонка</th><th>Колонка</th><th>Колонка</th></tr>
</thead>
<tbody>
<tr><td>Данные</td><td>Данные_два</td><td>Еще_данные_три</td></tr>
</tbody>
</table>
<div class="fixed_table_container"> <!-- Контейнер для отображения видимой части фикс. таблицы -->
<table id="t2" class="example_table"> <!-- Фиксированная таблица (клон оригинальной) -->
<thead> <!-- Видимый заголовок -->
<tr><th colspan="3">Заголовок</th></tr>
<tr><th>Колонка</th><th>Колонка</th><th>Колонка</th></tr>
</thead>
<tbody> <!-- Тело фикс. таблицы за пределами видимой части контейнера fixed_table_container -->
<tr><td>Данные</td><td>Данные_два</td><td>Еще_данные_три</td></tr>
</tbody>
</table>
</div>
Есть таблица t1, для которой с помощью спец. библиотеки (для упрощения в примере не задействована) создается фиксируемая шапка при помощи таблицы t2 (при прокручивании очень длинных таблиц), находящаяся в контейнере fixed_table_container. Контейнер fixed_table_container предназначен для ограничения видимой области таблицы t2, видимая область, ее размер и положение вычисляется программно.
Таблица t2 является полной копией таблицы t1, в том числе по стилям.
Элемент thead таблицы t2 служит для отображения фикс. заголовка.
Элемент tbody таблицы t2 служит для выравнивания ширины у колонок по контенту.
Вопрос:
Как ограничить поиск по содержимому на странице, доступный в браузере по Ctrl+F, для содержимого таблицы t2?
Так как содержимое таблиц продублировано, поиск дает удвоенное значение результатов. Когда пользователь начинает проходить каждый результат, то он неизбежно выходит на содержимое таблицы t2, которое в Chrome - можно шагать по скрытой части, результат - не виден, а в IE становится виден вспомогательный tbody таблицы t2. (В Firefox - нет проблем)
При разработке модуля фиксирования шапки рассматривался вариант отказаться от дублирования tbody таблицы t2, но зафиксировать размеры всех ячеек th в t2 один к одному как у таблицы t1 - нереально. Для этого нужно использовать свойство table-layout: fixed, однако, в браузере Firefox при группировке строк и/или столбцов заголовков с помощью атрибутов rowspan и/или colspan в thead, свободные от группировки ячейки не подчиняются заданным через свойства размерам (На примере: сгруппированная ячейка - "Заголовок", негруппированные ячейки, на которых нельзя задать размер - "Колонка").
Простой
