Navbar使用jQuery取消css属性修复了顶部

Question

我正在创建一个WordPress网站，并设法在我使用此代码向下滚动页面时将导航栏固定在顶部：

(function( $ ){   
    var navOffset = jQuery("nav").offset().top; 
    jQuery(window).scroll(function() {
       var scrollPos = jQuery(window).scrollTop();
        if(scrollPos >= navOffset) {
            jQuery("nav").addClass("fixed");
        }else {        
            jQuery("nav").removeClass("fixed");
        }     
   });     
})(jQuery);

但现在当我点击页面上的图标（在“产品和服务”部分）时，弹出窗口和图标上应用的动画都不起作用。

当我停用这个特定的jQuery代码时，弹出窗口工作正常。

还有另一种方法可以让导航栏固定在顶部并且我的图标仍能正常工作吗？

jQuery有什么问题吗？ http://scentology.burnnotice.co.za/

Answer 1

看来你的导航在修复后覆盖了整个屏幕

屏幕截图：

这是因为您在导航

上有bottom: 0 css属性

nav#site-navigation {
    position: absolute;
    right: 0;
    bottom: 0;
}

解决方案是确保bottom: 0在处于修复模式时被禁用。您可以将bottom: auto !important;添加到.fixed类

.fixed {
    top: 4%;
    width: 100%;
    text-align: center;
    bottom: auto !important;
}