Доброго времени суток! Подскажите, есть маленький скрипт, который добавляет класс .fixed к меню, чтобы оно прилипало при прокрутке, как правильно прописать fadein и fadeout, чтобы это происходило с анимацией?
Скрипт:
https://codepen.io/maxbeat/pen/KKpNvwY
$(document).ready(function($){
var navPos, navHeight;
function refreshVar() {
navPos = $('.menu').offset().top; // определяем положение блока меню
navHeight = $('.menu').outerHeight(true); // определяем высоту меню
}
refreshVar();
$(window).resize(refreshVar);
$('<div class="clone-menu"></div>').insertBefore('.menu').css('height', navHeight).hide(); // вставляем перед меню блок с такой же высотой и прячем его
$(window).scroll(function() {
if ($(window).scrollTop() > 300) { // при прокрутке больше 300px
$('.menu').addClass('fixed'); // добавляем меню класс .fixed
$('.clone-menu').show(); // отображаем клон блока меню
}
else {
$('.menu').removeClass('fixed');
$('.clone-menu').hide();
}
});
});
Простой
