滚动时,活动菜单不会进行转换

时间:2017-10-31 12:39:16

标签: javascript jquery html css

我已经创建了一个右侧菜单但是当我向下滚动它没有将活动类更改为下一个菜单时,我已经使用了这段代码很多时间但是这次我没有得到结果,

  $(window).scroll(function() {
    var scrollbarLocation = $(this).scrollTop();

    scrollLink.each(function() {

      var sectionOffset = $(this.hash).offset().top - 70;

      if ( sectionOffset <= scrollbarLocation ) {
       $('.icons').removeClass('iconactive');
       $(this).children('.icons').addClass('iconactive'); 

      }
    });
  });

DEMO

2 个答案:

答案 0 :(得分:0)

我认为您的代码中缺少var scrollLink = $('.myanimate');。在DEMO中添加此行可使代码正常工作。

$(window).scroll(function() {
    var scrollbarLocation = $(this).scrollTop();
    var scrollLink = $('.myanimate');
    scrollLink.each(function() {

      var sectionOffset = $(this.hash).offset().top - 70;

      if ( sectionOffset <= scrollbarLocation ) {
       $('.icons').removeClass('iconactive');
       $(this).children('.icons').addClass('iconactive'); 

      }
    });
  });

  $(".myanimate").click(function (){
      $('html, body').animate({
         scrollTop: $($(this).attr('href')).offset().top
      }, 2000);
  });

答案 1 :(得分:0)

你需要定义scrollLink,你可以通过添加像这样的函数点击锚链接来给出一些动画效果

 $(document).on('click', 'a[href^="#"]', function (event) {
    event.preventDefault();
    $('html, body').animate({
        scrollTop: $($.attr(this, 'href')).offset().top
     }, 1000);
 });

演示:http://jsfiddle.net/3xmop98u/