コンテナ内でのDIVの表示と非表示

Question

私のページには、コンテナ部門内で「ニュース」と呼ぶ「ページ区切りメニュー」divと呼ばれるdivがあります。ページ区切りのメニューdivは、ニュースdivをスクロールしているときにのみ表示され、他のコンテナdivをスクロールすると消えます。

$(window).scroll(function(){ 
 
     var elementoffset = $('#news').offset(); // <<< change #elementhere with your element you want the scroll to make action when reach it       
 
     if ($(this).scrollTop() > elementoffset.top - 75) { 
 
      $('.pagination-menu').fadeIn(150); 
 
      $('.pagination-menu').addClass('displaybox'); 
 

 
     } 
 
     else { 
 
      $('.pagination-menu').fadeOut(150); 
 
      $('.pagination-menu').removeClass('displaybox'); 
 
     } 
 
     
 
    }); // EOF scroll

がどのように私はニュースのdivのスクロールを介して結合ページネーションを保つん：

これは私がこれまで持っているコードはありますか？現時点では、ページ区切りのメニューdivは、スクロールによってニュースdivに到達するまで表示されませんが、ニュースdivの下限を過ぎてもそのまま残ります。

ありがとう、私は何か助けていただきありがとうございます。

Answer 1

var newsEle = $('#news'), 
    pageEle = $('.pagination-menu'), 
    newsEleOffset,newsEleBottom; 

    function fnFadeIn(){ 
     pageEle.fadeIn(150); 
     pageEle.addClass('displaybox'); 
    } 
    function fnFadeOut(){ 
     pageEle.fadeOut(150); 
     pageEle.removeClass('displaybox'); 
    } 
    $(window).scroll(function() { 
     newsEleOffset = newsEle.offset(); 
     newsEleBottom = newsEleOffset.top + newsEle.height(); 
     if ($(this).scrollTop() > newsEleOffset.top - 75) { 
      if ($(this).scrollTop() > newsEleBottom) { 
       fnFadeOut(); 
      } else { 
       fnFadeIn(); 
      } 
     } 
     else { 
      fnFadeOut(); 
     } 
    });