Имеется блок <header>
и при скролле, когда <header>
уже не видно, нужно сделать его фиксированным, чтобы его было постоянно видно.
Код JS:
$(window).scroll(function() {
var scroll = $(this).scrollTop(),
$bottom = $('.bottom');
if( !$bottom.hasClass('fix') && scroll > 50 ){
$bottom.addClass('fix');
}else if( $bottom.hasClass('fix') && scroll <= 50) {
$bottom.removeClass('fix');
}
})
Но меня интересует следующее в этом JS-коде:
Получается, что при скроллинге будет постоянно вызываться этот обработчик?
Можно ли как-то сделать, чтобы этот обработчик срабатывал только в верхней части страницы, т.е. чтобы не перегружать браузер лишними обработчиками?
Как обычно решается эта проблема?
И правильно ли я сделал обработчик?