2

フッターがビューポートに出入りしたときにイベントを発生させるためにjquery-waypointプラグインを使用しようとしています。

jsfiddleで例を作成しましたが、フッター要素でイベントが発生しません。

助言がありますか？

4

3 に答える 3

4

ウェイポイントはスクロールウィンドウの上部がウェイポイントに到達したときにのみトリガーされるため、イベントはトリガーされません。あなたの場合、HR要素をウィンドウの上部にスクロールすることはできないため、ウェイポイントに到達することはありません。

これを解決する1つの方法は、ウェイポイントにオフセットパラメータを指定することです。

$(document).ready(function() {
  $('hr').waypoint(function(event, direction) {
    alert(direction);
  }, {offset: 900});
});​

これにより、ウェイポイントは、実際にスクロールウィンドウの上部に到達する前にイベントを900px発生させるように指示されます。ただし、そのソリューションは、ユーザーの画面解像度に依存するため、最適ではありません。ブラウザのウィンドウサイズを変更してテストし、パフォーマンスを確認できます。

しかし、もっと良い解決策があります。何を達成したいのかわからないので、前回の記事にウェイポイントを設定することをお勧めします。

于 2012-08-29T08:18:27.787 に答える
1

offset:上からの明示的なピクセルではなく、上からのパーセンテージを渡します。

$('containerDiv').waypoint(function() {
        $('targetElem').fadeIn();
    }, { offset: '50%' });
于 2014-03-01T00:27:43.143 に答える
1

下から画面に入る要素にウェイポイントを発射する場合は、offset: '100%'

  $('hr').waypoint(function(event, direction) {
    // Do something
  }, {offset: "100%"});
于 2014-05-23T16:04:04.557 に答える