jqueryウェイポイント：同じオブジェクト上に複数のウェイポイントをバインドする方法

Question

jqueryウェイポイントは、オブジェクトがスクロールしながらビューポートに表示されるときにコールバックを発生させます。これは基本的な実装でうまく動作します。 offset: 121（ページをスクロールダウン上）：

今私は<article />が表示されたら、<article />が上から見える121pxであるとき、今同じ「アーティクル」タグ、いずれかに別のものを2ウェイポイントを与えることを試みます。

// waypoint 1 
$.aquaverde.article.waypoint(function(event, direction) { 
     currentIndex = $(this).index(); 
     if (direction === "down") { 
      $.aquaverde.wrapper.find('.fixed:eq('+ currentIndex +')').show().siblings(".fixed").hide(); 
     } 
}); 

// waypoint 2 
$.aquaverde.article.find('.page').waypoint(function(event, direction) { 
     if (direction === "down") { 
      $.aquaverde.wrapper.find(".fixed").hide(); 
     } 
    },{ 
    offset: 121 
}); 

オブジェクトが上から121pxであるので、第二の構成が優位をとる場合残念ながら、プラグインは、両方のコールバックを起動します。

OKは、その後、私は、連鎖呼び出し実行しようとしました：

// waypoint 1 
$.aquaverde.article.waypoint(function(event, direction) { 
     currentIndex = $(this).index(); 
     if (direction === "down") { 
      $.aquaverde.wrapper.find('.fixed:eq('+ currentIndex +')').show().siblings(".fixed").hide(); 

      // waypoint 2 
      $(this).waypoint(function(event, direction) { 
       $.aquaverde.wrapper.find(".fixed").hide(); 
      },{ 
       offset: 121    
      }); 
     } 
}); 

をしかし、それは私のに上記のようなまったく同じ結果を与えます。 これを解決するためのアイデアはありますか？

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

ありがとうございます。

Answer 1

更新日：以下は、jQueryウェイポイント1.xの場合のすべてです。元の回答から、Waypoints 2.0がリリースされ、同じ要素に複数のウェイポイントをサポートしています。ちょうどwaypointを呼び出すOPの方法はちょうどうまくいくはずです。

---

（コールバックの署名はただ一つのパラメータ、direction。に変更されていますが）これは、現在、jQueryのウェイポイントでは不可能です。各要素は1つのオフセットしか持てないので、2番目の要素は最初の要素をオーバーライドします。少し埋葬されましたが、an issue opened on this beforeがありました。そこに私の応答は、この制限を回避作業の2つの方法が用意されています

• それはラッパーまたは同じあなたの記事要素として、ページ上のオフセットを持つ他の要素である、第二の要素を使用してください。
• GitHubの問題の場合は、別のプラグインin-viewを使用してください。

これは今のところあなたのベストベットです。私はこのためにnew issueを作成しました。これは便利ですが、プラグインを深刻に改訂する必要があります。

更新日：上記の答えは正しいです。具体的なケースでは、子要素の使用で何をしようとしているのかは問題ありませんが、子ウェイポイント内でevent.stopPropagation()コールを追加して、イベントがバブルしないようにして記事のウェイポイントを発生させ、あなたの隠す呼び出し。