Interactive

Web Development Services

Fix or modify an element on page at a scroll position</h4>

Fix or modify an element on page at a scroll position

Fix a second header as main header on scroll down or any animation or event at a specific scroll position. You can add more if statements to produce stepping(parallax) effects.

Copy CSS

/*css*/
.fixed{
    width:100%;
    position:fixed;
    top:0;
    left:0;
}

Copy JQUERY

//jquery
$(window).on('scroll', function () {
    var position = Math.round($(window).scrollTop());         
    if (position > 100) {
        $("div.column-map").addClass("fixed");
    } 
    else {
        $("div.column-map").removeClass("fixed");
    }
});

comments

no comments...

Leave A Comment

Don’t wait! Your customers are surfing the Web right now. Get your website up today.

get in touch