Take the 2-minute tour ×

I have a problem that I can not get my head around. I have created a sticky nav which when the page is scrolled, it becomes fixed at the top. It should then return to its normal position if the user scrolls back up. I have this working perfectly on my localhost, but when I upload it online, the sticky nav just keeps jumping straight to the top as soon as you even scroll a little bit of the page, and it never returns to its normal position. This is just an issue in web

Could anyone please help with this? My example is: http://debourg.ch/dev/syselcloud/design4/

The jQuery concerned is:

var yOffset = $("#local-nav-wrapper").offset().top;
$(window).scroll(function() {
    if ($(window).scrollTop() > yOffset) {
            'top': 0,
            'bottom': 'auto',
            'position': 'fixed'
    } else {
            'top': 'auto',
            'bottom': 0,
            'position': 'absolute'

The CSS concerned is:

#local-nav-wrapper {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 10px 0;
    z-index: 6000;
share|improve this question
the nav works fine on my screen, MAC FF 11 –  Huangism Oct 9 '12 at 12:46
yea it's just webkit browsers that seem to pose the issue. –  user1280853 Oct 9 '12 at 14:04
just tried on mac chrome and it works as well –  Huangism Oct 9 '12 at 17:03
add comment

1 Answer

If you work in IE try and replace $(window).scrollTop() with document.documentElement.scrollTop or window.scroll(0,0). Maybe it helps.

share|improve this answer
It didn't work at all when I tried this, anymore suggestions? Many thanks –  user1280853 Oct 9 '12 at 14:05
add comment

Your Answer


