3回答

• 

  田紫

  2016-10-27 10:52:15

  <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

  <script>

  $(document).ready(function(){

  //滚动条发生滚动

  $(window).scroll(function(){

  var top=$(document).scrollTop();

  var menu=$("#menu");

  var items=$("#contant").find(".item");

  var currentId="";//当前所在的楼层

              items.each(function(){

              var m=$(this);

              var itemTop=m.offset().top;

              if(top>itemTop-200){

              currentId="#" + m.attr("id");

              }else{

              return false;

              }

          });

              //给相应楼层的a设置current，取消其他连接的current

              var currentLink = menu.find(".current");

              if(currentId && currentLink.attr("href") != currentId){

              currentLink.removeClass("current");

              menu.find("[href="+ currentId +"]").addClass("current");

              }

      });

  });

  </script>

  
  

  0 0
• 

  慕粉3760367

  2016-10-20 10:51:06

  我改正了   为什么导航条不随着页面的变化而变化呀

  1 0

  就这样简简单...

  我把你的代码放在我这边都是好的

  2016-10-20 11:04:25

  共 1 条回复 >

• 

  就这样简简单单

  2016-10-20 10:34:36

  1.你代码是没有问题的，只是script标签放错了位置。<script src="http://libs.baidu.com/jquery/1.9.1/jauery.js"></script>这行代码是引入jquery。然后再把

    $(document).ready(function(){

      $(window).scroll(function(){

          var top=$(document).scrollTop();

          var menu=$('#menu');

          var items=$('#content').find(".item");

          var currentId="";

          items.each(function(){

             var m = $(this); 

             var itemTop=m.offset().top;

             if(top > itemTop){

              currentId="#" + m.attr("id");

             }else{return false;}

          });

          var currentLink=menu.find(".current");

          if(currentId && currentLink.attr("href") != currentId){

              currentLink.removeClass("current");

              menu.find("[href=" + currentId + "]").addClass("current");

          }

      });

     }); 

  放在<script></script>中即可。

  2.

  if(currentId && currentLink.attr("href") != currentId){

              currentLink.removeClass("current");

              menu.find("[href=" + currentId + "]").addClass("current");

          }

      })

  这段代码的作用是给当前选中楼层设置current 并且取消其他楼层的current样式。currentId 是实际应该选中楼层的id，当页面没有滚动时，currentId为空。currentLink.attr("href") != currentId是当前页面显示选中的楼层不等于实际应该选中的楼层。也就是说当页面发生滚动，并且当前页面显示的选中楼层和实际应该选中的楼层不一致时进入该循环。 currentLink.removeClass("current");先把所有的楼层的选中样式都清空，menu.find("[href=" + currentId + "]").addClass("current");通过currentId找到该楼层，并把选中样式current给该楼层。

  0 0