Scrolll后的固定导航菜单

Question

我试图创建一个粘滞的导航菜单，它将被定位在横幅下方，当您向下滚动并且横幅无法再被看到时，导航菜单将被固定在浏览器的顶部铬。这是我到目前为止有：http://tinyurl.com/bper44a

的CSS是直线前进，该问题可能与我的JS：

$(document).ready(function() { 
    var s = $(".navMenu"); 
    var pos = s.position(); 
    $(window).scroll(function() { 
     var windowpos = $(window).scrollTop(); 
      if (windowpos >= pos.top) { 
       s.addClass("fixedTop"); } 
      else { 
       s.removeClass("fixedTop"); 
       } 
     }); 
    }); 

虽然它的工作原理完全相同的方式上希望它在Firefox中，我能找出原因它在Chrome和Safari中表现不同（只要向下滚动一下，就进入固定位置）。

任何见解？

Answer 1

不知道为什么它工作在Firefox，但我认为下面会为所有的浏览器：

$(document).ready(function() { 
    var s = $(".navMenu"); 
    var banner = $("header > img"); 

    $(window).scroll(function() { 
     var windowpos = $(window).scrollTop(); 
      // if the scroll position is greater than the height of the banner 
      // fix the navigation. 
      if (windowpos >= banner.outerHeight()) { 
       s.addClass("fixedTop"); } 
      else { 
        s.removeClass("fixedTop"); 
       } 
      }); 
     }); 

强制性小提琴here。