Принудительно запустить javascript *перед * перерисовкой браузера (пример jsFiddle)

Я создаю небольшое веб-приложение, используя таблицу HTML. Одним из необычных свойств этой таблицы является то, что она имеет фиксированную верхнюю строку и левый столбец (аналогично excel). Я сделал это, используя немного jQuery и CSS.

проблема в том, что событие jQuery, которое запускает мой код, является $(window).прокрутите событие, и, очевидно, большинство браузеров (Chrome и IE) перерисовывают страницу до завершения работы кода, вызываемого этим событием. В результате левый столбец и верхняя строка потратьте долю секунды, чтобы" догнать " остальную часть стола.

Я представила урезанная пример jsFiddle чтобы показать вам мою проблему. Примечание: отставание не очень заметно, когда таблица настолько мала и (относительно говоря) пуста содержания. Тем не менее, он есть (если вы не используете Firefox). Есть ли способ избавиться от этой задержки?

спасибо!

2 ответов


просто идея, но, возможно, стоит рассмотреть: вы можете попробовать использовать requestAnimationFrame как описано в в этой статье (или аналогичным образом). Это может сгладить проблемы с обновлением / "отставанием".


Я не получил это для работы ни с событием прокрутки, ни с requestAnimationFrame. То, что я закончил, это присоединение к событию mousewheel, которое срабатывает до прокрутки и рендеринга. Если событие прокрутки идет вниз, я могу применить соответствующий класс вовремя для рендеринга.