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

Question

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

Answer 1

我添加了一个变量，该变量endpoint设置为最终 div 的偏移量加上 div 的高度，当页面滚动超出此值时，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');  
    }


  });
});