Question

我有一个带有ul和菜单的菜单作为内容，当我滚动到第一个框时，ul的样式更改为另一个样式，当我滚动到第二个框时，ul的样式更改为相同的另一个样式和第一个ul风格回归它的原始风格，就像那样。问题是当我到达页面的末尾时，有空间并且所有的uls样式应该返回到它的原始样式但是jquery代码的问题是最后的ul样式（对于最后一个框）仍然像我一样在最后一个方框。正如你在这里看到http://ge.tt/1yoq2sg/v/0?c当我到达页面末尾时，菜单中的每个ul样式应该是原始样式，但事实并非如此。您也可以下载该文件。

Answer 1

我添加了一个变量endpoint，它设置为最终div的偏移量加上divs height，当页面滚动超出此范围时，menutext2类被删除。

$(function(){

  var offsets = [],
      menuText = $('#menu .menuText'),
      endpoint;

  $("div.contentDiv").each( function(i, div) {
      if(i==$("div.contentDiv").length-1){endpoint=$(div).offset().top+$(div).outerHeight();}
      offsets.push({ id: div.id, offset: $(div).offset().top - 60});
  });

  $(window).scroll(function(e) {
    var start = $(this).scrollTop();
    var end = $(this).scrollTop();
    for ( var div = 0; div < offsets.length; div++ ) {
      if ( start > offsets[div].offset ) { 
        menuText.removeClass('menutext2').addClass('menutext');  

        menuText.filter('[linkId="'+offsets[div].id+'"]').addClass('menutext2').removeClass('menutext');
        }
    }

    if ( start === 0 || $(this).scrollTop()>endpoint) {
    menuText.removeClass('menutext2').addClass('menutext');  
    }


  });
});

滚动到div时菜单ul样式更改

1 个答案: