Исправлено меню навигации после 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 обязательное скрипку.