2016-04-19 10 views
0

これは動的です。ナビゲーションはページに基づいて変更されます。ここのコードは、セクションにスクロールするときにクラスにナビゲーションを追加し、過去にスクロールするときにクラスを削除します。問題は、セクションを過ぎてスクロールしなくても削除されることだけです。クラスを追加してスクロールダウンする際にスクロールアップするとき、クラスを削除する条件をどうやって行うのですか?アンカーにスクロールするときにnavにクラスを追加します

jQuery(document).ready(function() { 
    var sectionelements = jQuery('.nav li'); 
    (function(jQuery) { 

    var scrolling = function(){ 
     jQuery(sectionelements).each(function(){ 
      var object=jQuery('#'+this); 
      var wh = jQuery(window).height(); 
      var st = jQuery(document).scrollTop(); 
      var ot = jQuery(object).offset().top; 
      var eh = jQuery(object).height();     
      var href="a[href*=#"+object.attr('id')+"]"; 
      if(st>ot){ 
       jQuery(href).addClass('posreached'); 
      } 
      if (st>ot+eh) { 
       jQuery(href).removeClass('posreached'); 
      }; 
     }) 
    }; 
     jQuery(window).scroll(scrolling); 
     jQuery(window).bind('resize orientationchange',scrolling); 

//fire initial scroll 
jQuery(window).scroll(); 
    })(jQuery); 
}); 
+0

あなたはフィーリングの例をフィーチャーできますか? – Vector

+0

ウェイポイントライブラリを確認するhttp://imakewebthings.com/waypoints/ – thumbtackthief

+0

フィドルでそれを作成しようとしています –

答えて

0

この:

if(st>ot){ 
    jQuery(href).addClass('posreached'); 
} 
if (st>ot+eh) { 
    jQuery(href).removeClass('posreached'); 
}; 

も、第2の状態で最初はtrueになりますので、uが追加する必要があります。

if(st>ot || st<ot+eh){ 
    jQuery(href).addClass('posreached'); 
} 

はそれを試し

+0

どのクラスを追加するかクラスを削除する –

+0

追加クラス –

+0

それはちょうど同じことをしましたが、ありがとう –

0

を与える私が使用これらは私の条件のために働いた

    if(st>ot){ 
         jQuery(href).addClass('posreached'); 
        } 
        if (st<ot) { 
         jQuery(href).removeClass('posreached'); 
        } 
        if (st>ot+eh) { 
         jQuery(href).removeClass('posreached'); 
        } 
関連する問題