Wednesday, November 8, 2017

Sticky header on immediate scroll


jQuery(document).ready(function(){
var DesktopBreakpoint = 1199;

function sticky_header_activate() {
if (!jQuery('.sticky-height').hasClass('active')) {
jQuery('.sticky-height').addClass('active').height(108);
jQuery('#header').addClass('affix').slideDown();
jQuery('.logo img').animate({
"width": "165px"
}, 150);
}
}

function sticky_header_deactivate() {
if (jQuery('.sticky-height').hasClass('active')) {
jQuery('.sticky-height').height(0).removeClass('active');
jQuery('#header').removeClass('affix');
if (jQuery(window).width() > DesktopBreakpoint) {
jQuery('.logo img').animate({
"width": "247px"
}, 250);
}
}
}

function sticky_header_mobile() {
jQuery('.sticky-height').height(108).removeClass('active');
jQuery('#header').removeClass('sticky');
}

function sticky_header_on_scroll() {
jQuery(window).scroll(function() {
var where_scroll = jQuery(window).scrollTop();
if (jQuery(window).width() > DesktopBreakpoint) {
if (where_scroll > 1) {
sticky_header_activate();
} else {
sticky_header_deactivate();
}
} else {
sticky_header_mobile();
}
});
}

function sticky_header() {
if(jQuery(window).width() > DesktopBreakpoint) {
var where_scroll = jQuery(window).scrollTop();
if (where_scroll > 1) {
sticky_header_activate();
sticky_header_on_scroll()
} else {
sticky_header_deactivate();
sticky_header_on_scroll();
}
} else {
sticky_header_mobile();
}
}

// Initialize sticky header
sticky_header();

jQuery(window).resize(function() {
sticky_header();
});
});

No comments:

Post a Comment