Делаю фиксированное адаптивное меню на jquery. Использую обработчик событий $(window).scroll, если скролл больше 10, то добавляем новый стиль addClass("nav_scroll"); Всё работает, всё ок, но проблема в том, что когда страница перезагружается во время того как скролл больше 10, то страница показывает старую навигацию без добавления нового стиля. Для этого отдельно я прописываю для каждого события добавление стиля ( $(window).scroll и if (($(window).scrollTop() > 10) && (navHasFixed === 'fixed')) в случае перезагрузки страницы.
Собственно вопрос: можно ли объединить все эти условия? Например было бы круто, если бы работало if (($(window).scrollTop() > 10) && (navHasFixed === 'fixed')) || $(window).scroll(). Как всё это можно реализовать?
Вот код который на данный момент у меня сейчас:
$(document).ready(function(){
var navHasFixed;
navHasFixed = $('.nav').css('position');
$(window).resize(function(){
navHasFixed = $('.nav').css('position');
});
var nav_bar = $('.nav');
if (($(window).scrollTop() > 10) && (navHasFixed === 'fixed')) {
nav_bar.addClass("nav_scroll");
};
$(window).scroll(function(){
if (($(this).scrollTop() > 10) && (navHasFixed === 'fixed')) {
nav_bar.addClass("nav_scroll");
} else {
nav_bar.removeClass("nav_scroll");
}
});
});
