Таблица с фиксированной левой колонкой

Однажды потребовалось сделать таблицы с возможностью горизонтальной прокрутки содержимого, но зафиксировать первую колонку, чтобы заголовки строк всегда были перед глазами.

Не нашел ничего путного готового, в итоге предлагаю как заготовку следующий вариан, может, кому-то пригодится:

Демо таблица с фиксированной левой колонкой

Вся суть там в позиционировании, сам же яваскрипт занимает всего несколько строк. Общая идея такая:

• у нас есть общий контейнер фиксированной ширины, который ограничивает видимый размер таблицы; вся работа осуществляется внутри него;
• создаем клон оригинальной таблицы, помещаем ее в блок с overflow:hidden и scroll-x:auto, ширина которого меньше ширины общего контейнера на ширину первой колонки; смещаем клон таблицы влево так, чтобы первая колонка клона ушла за его границу;
• позиционируем контейнер с клоном поверх основной таблицы так, чтобы визуально он наложился на основную без искажений

все.

Ограничения.

• При клонировании теряются все события, поэтому если таблица напичкана интерактивностью, события придется добавлять заново.
• Я не задавлся целью стилизовать прокрутку и с этим, скорее всего, придется повозиться.
• ИЕ6 и ИЕ7 идут лесом.