Чтобы избавиться от лишних перерисовок страницы Пол Льюис советует отключить эффекты страницы при наведении (игнорировать hover
) во время прокрутки её пользователем.
При возникновении события scrollstart
добавляем к тегу <body> класс disable-hover
, внутри которого прописываем pointer-events: none, а при возникновении события scrollend
удаляем этот класс по таймеру:
var timer, class = 'disable-hover', $body = $('body'); $(window).scroll(function() { clearTimeout(timer); if (!$body.hasClass(class)) { $body.addClass(class); } timer = setTimeout(function(){ $body.removeClass(class); },500); });
Кратко описываем наш умный класс:
.disable-hover, .disable-hover * { pointer-events: none !important; }
И вы на себе почувствуете колоссальный прирост в скорости работы вашего сайта.