jquery - ページ スクローラーの jQuery アクティブ クラス

Question

ここにコードがあります：http://jsfiddle.net/5UzfT/

コンテンツをスクロールするときにアクティブなクラスを追加するにはどうすればよいですか?

Answer 1

アクティブであると思われるのはメニュー項目だと思います。そうであればthis、リンクに追加してください：

<a href="#" onClick="Animate2id('#c1', this);return false">Content 1</a>

そして、やります：

<script type="text/javascript">
  function Animate2id(id2Animate, elm){
    $(elm).addClass('active').siblings().removeClass('active');
    var animSpeed=1500; //animation speed
    var easeType="easeInOutExpo"; //easing type
    $("html, body").stop().animate({scrollTop: $(id2Animate).offset().top}, animSpeed, easeType);
  }
</script>

フィドル

これは、メニューをクリックしたときにのみ機能します。

Answer 2

これを見てください

http://imakewebthings.com/jquery-waypoints/

下にスクロールすると、上のメニューがアクティブなフォーカスに変わることを確認します。