5

私はこの素晴らしいプラグインを使用して、モバイルデバイスのワイプイベントをキャプチャしています:http://www.netcu.de/jquery-touchwipe-iphone-ipad-library

そのページのソースにあるコードを使用して、画像ギャラリーを適切に循環させています。ただし、私の画像ギャラリーは画面の全幅です。残念ながら、タッチワイプはデフォルトの上下ワイプがページを上下にスクロールするのを妨げているようです。他の動作が指定されている場合を除いて、デフォルトの動作を使用するようにする方法はありますか?

$(document).ready(function() {
    $('#imagegallery').cycle({
        timeout: 0,
        fx: 'scrollHorz',
        next: '#next',
        prev: '#prev' 
    });

    $("#imagegallery").touchwipe({
        wipeLeft: function() {
            $("#imagegallery").cycle("next");
        },
        wipeRight: function() {
            $("#imagegallery").cycle("prev");
        }
    });
});

私はまた、この同じ効果を達成するための他の選択肢(他のプラグイン、他の方法)を受け入れています。ありがとう!

4

2 に答える 2

12

jquery.touchwipeライブラリへのこの小さなパッチで:

if(Math.abs(dx) >= config.min_move_x) {
     cancelTouch();
     if(dx > 0) {
-        config.wipeLeft();
+        config.wipeLeft(e);
     }
     else {
-        config.wipeRight();
+        config.wipeRight(e);
     }
  }
  else if(Math.abs(dy) >= config.min_move_y) {
     cancelTouch();
     if(dy > 0) {
-        config.wipeDown();
+        config.wipeDown(e);
     }
     else {
-        config.wipeUp();
+        config.wipeUp(e);
     }
  }

次に、コードを変更して、e.preventDefault()を選択的に呼び出すことができます。

$(document).ready(function() {
    $('#imagegallery').cycle({
        timeout: 0,
        fx: 'scrollHorz',
        next: '#next',
        prev: '#prev' 
    });

    $("#imagegallery").touchwipe({
        wipeLeft: function(e) {
            e.preventDefault();
            $("#imagegallery").cycle("next");
        },
        wipeRight: function(e) {
            e.preventDefault();
            $("#imagegallery").cycle("prev");
        },
        preventDefaultEvents: false
    });
});

(プラグインの作成者にパッチを送信しました。)

于 2012-10-31T07:11:29.413 に答える
0

部分的に機能する一時的な回答を見つけました。ここにあります:http://plugins.jquery.com/content/vertical-scroll

しかし、より良い答えを得るのは良いことです。

于 2011-06-02T16:25:30.137 に答える