1

ページのセクションをスクロールするために、マウスホイールとウェイポイント プラグインを使用しています。私が抱えている問題は、Apple Mighty マウスを使用してスクロールすると、スクロールが過敏になり、アニメーションが完了すると関数が複数回トリガーされることです。アニメーションが完了したかどうかを確認するためにタイムアウト関数と変数を設定しようとしましたが、どちらも機能しませんでした。

このウェブサイトにあるものと同様の効果を再現したいと考えています。

Jクエリ

  $('body').mousewheel(function(event, delta, deltaX, deltaY) {

  clearTimeout(interval);

  console.log('test');

    $('section').waypoint(function(direction){
      thisID = $(this);
    },{ offset: '350' });

    indexPos = thisID.index('section');

    if (completed == true) {
      completed = false;

      var interval = "";
      if (delta > 0) {
          interval = setTimeout(function(){
            if ($(this).not(":first-child")) { 
              //$(this).animate(function(){
                  $('html, body').stop().animate({
                      scrollTop: thisID.prev().offset().top - 200
                  }, 1000, 'swing' , function() { completed = true; });
                //});
            }else {
              $('html, body').stop().animate({
                      scrollTop: thisID.offset().top - 200
                  }, 1000, 'swing' , function() { completed = true;  });
            }
          },400);
        }
      else if (delta < 0) {
        interval = setTimeout(function(){
        if ($(this).not(":first-child")) { 
            $('html, body').stop().animate({
                  scrollTop: thisID.next().offset().top - 200
              }, 1000, 'swing' , function() { completed = true; });
          }
          else {
            $('html, body').stop().animate({
                  scrollTop: thisID.offset().top - 200
              }, 1000, 'swing' , function() { completed = true;  });
          }
          },400);
      }

    };                

      return false; // prevent default

  });
4

3 に答える 3

2

これが何をしているのかわかりませんがindexPos = thisID.index('section');、何かをする前に、まだ何も進行していないかどうかを確認します:

$('body').mousewheel(function(event, delta, deltaX, deltaY) {
    if($('html').is(':animated') || $('body').is(':animated')) return false;
    // else, do your stuff...
});
于 2013-08-15T22:32:40.897 に答える