カスタムイベントを別のスクリプトからオンザフライでロードされた要素にバインドする方法はありますか？

Question

私はmy tumblrのために働く無限のスクロールスクリプトを持っています。 ページを下にスクロールすると画像が読み込まれます。 しかし、私は突然表示されるのではなく、画像fade inを持っています。

私はこの種のことを行うwaypointsという素晴らしいプラグインを見つけました。そして、それは動作しますが、最初にロードされたイメージ上でのみ動作します。その後、新しく読み込まれた画像は認識されません。

「ライブ」は特定のjQuery関数でのみ動作することがわかりました。そして、bindは、カスタム関数を使用できるので、より良いかもしれません。しかし、私はまだ明らかにtriggerスクリプトに持っている必要があります、そして、これは私が行う方法を知らないです。これは、無限のスクロールを行うtumblrスクリプトをハックする必要があることを意味します。and it's scary in there、jQueryではなくjavascriptです。

おそらくもっと良い方法をお勧めしますか？ここで

は、最初の10枚の画像のために動作するコードです：

$('.theImage').waypoint(function() { 
    $(this).animate({opacity: 1}, 'slow'); 
}); 

私はちょうどこのような何かことがしたい：。

$（ 'theImageを'）（ "ウェイポイント" をバインドします、function（）{ $（this）.animate（{opacity：1}、 'slow'）; }）;

ありがとうございます。

PS内容はmiiiiildly nsfwです。実際には、1つの軽度にセクシーな画像が見えず、それが最下位にあるためです。乾杯。

Answer 1

liveはカスタムイベントでは機能しませんが、それ以上のウェイポイントでは、.waypoint()が呼び出された要素のイベントのみが発生します。したがって、新しいコンテンツがロードされた後にこの呼び出しを行う必要があります。

infinitescrollスクリプトをハックすることは問題になりませんので、ウェイポイントの代わりにjquery.inviewプラグインを使用することをおすすめします。インビューの仕方は、すべての要素によってトリガーされるイベントを作成するため、.live、.delegateを使用できます。