Question

我在我的网站上修改了一个菜单moroccoside.com和我试图修复菜单一旦到达它与jquery

我在标题上使用此jquery代码但它不起作用

   <script>
   var stickyOffset = $('.header-wrapper').offset().top;

   $(window).scroll(function(){
   var sticky = $('.header-wrapper'),
   scroll = $(window).scrollTop();

   if (scroll >= stickyOffset) sticky.addClass('fixed');
   else sticky.removeClass('fixed');
   });
   </script>

这是固定的css类

   .fixed {position:fixed; z-index: 9999;}

注意：我将脚本放在标题中而不是来自外部js文件

任何帮助都会如此有意义

Answer 1

你忘记了document.ready函数。试试这个：

jQuery(document).ready(function($){
  var stickyOffset = $('.header-wrapper').offset().top;

   $(window).scroll(function(){
     var sticky = $('.header-wrapper'),
     scroll = $(window).scrollTop();

     if (scroll >= stickyOffset) sticky.addClass('fixed');
     else sticky.removeClass('fixed');
   });
});

Answer 2

在运行之前，您需要确保DOM已加载。试试这个：

$(document).ready(function(){
  var stickyOffset = $('.header-wrapper').offset().top;

   $(window).scroll(function(){
   var sticky = $('.header-wrapper'),
   scroll = $(window).scrollTop();

   if (scroll >= stickyOffset) sticky.addClass('fixed');
   else sticky.removeClass('fixed');
   });
)};

如何在向下滚动时修改菜单

2 个答案: