Прилипающее меню
Меню располагается на высоте 200px от начала страницы. Нужно сделать так, чтоб меню прилипало к вершине страницы, когда страница проскролится ниже отметки в 200px. И само собой, откреплялось если скролить в обратную сторону.
Набросал функцию:
$(function(){
$(window).scroll(function() {
if($(this).scrollTop() >= 200) {
$('.navbar').addClass('navbar-fixed-top');
$('body').css("padding-top", "70px");
}
else{
$('.navbar').removeClass('navbar-fixed-top');
$('body').css("padding-top", "0px");
}
});
});
Все работает, но есть проблема - функция выполняется ПОСТОЯННО при событии скрола. Как это сделать правильно? Подскажите пожалуйста. |
Цитата:
debounce |
Цитата:
|
фиксация меню
PavelRem,
проверьте
$(function(){
var flag = true;
$(window).scroll(function() {
if($(this).scrollTop() >= 200 && flag) {
$('.navbar').addClass('navbar-fixed-top');
$('body').css("padding-top", "70px");
flag = !flag;
}
else if($(this).scrollTop() < 200 && !flag){
flag = !flag;
$('.navbar').removeClass('navbar-fixed-top');
$('body').css("padding-top", "0px");
}
}).trigger("scroll");
});
|
спасибо, работает
|
| Часовой пояс GMT +3, время: 12:47. |