Search code examples
javascriptscrollfixed

Define fixed position from scroll

I have a page that needs the header that is 145px from the top of the page to start using fixed positioning when it hits the top of the page. What's wrong with this?

$(window).scroll(function (event) {
    var y = $(window).scrollTop();
    var header2 = $('#header2');
    if (y >= 145) {
        header2.css({position:'fixed',top:0,marginTop:0});
    } else {
        header2.css({position:'static',top:0,marginTop:0});
    }
});
Solution

  • Here is a demo:

    $(window).scroll(function (event) {
    var y = $(window).scrollTop();
    var header2 = $('#header2');
    if (y >= 145) {
        header2.css({position:'fixed',top:0,marginTop:0});
    } else {
        header2.css({position:'static',top:0,marginTop:0});
    }
});

    its working perfectly with your code http://jsfiddle.net/vRSUs/1/