5

私はjqueryツールのスクローラーを持っています... swipeLeft swipeRightのみにタッチオプションを実装するのが好きです。

touch: true を使用すると、swipeUp/Down 時にも回転します。

ここの指示に従いました：

jQuery ツール タッチでスクロール可能 垂直スクロールを無効にする

そしてここ：

http://受賞歴のあるfjords.com/2010/09/22/handling-touch-events-in-jquery-tools-scrollable.html

しかし、どれもうまくいかないようです..何かアイデアはありますか？私のフィドル/デモは参考のために以下にあります

フィドル: http://jsfiddle.net/mmp2m/7/

デモ: http://jsfiddle.net/mmp2m/7/show

ありがとう

4

2 に答える 2

5

使用している唯一のコントロールがScrollableである場合は、ここからソース コードを編集して、その動作を修正するか、必要に応じて適応させることができます。

あなたが投稿したフィドルを修正して、コード セクションにScrollableコントロールのコードを含めましたJavaScript。

コントロールのコードに追加された行は// added、次のスニペットの最後にコメントがある行です。

    // touch event
    if (conf.touch) {
        var touch = {};

        itemWrap[0].ontouchstart = function(e) {
            var t = e.touches[0];
            touch.x = t.clientX;
            touch.y = t.clientY;
        };

        itemWrap[0].ontouchmove = function(e) {

            // only deal with one finger
            if (e.touches.length == 1 && !itemWrap.is(":animated")) {            
                var t = e.touches[0],
                     deltaX = touch.x - t.clientX,
                     deltaY = touch.y - t.clientY,
                     absX = Math.abs(deltaX),                              // added
                     absY = Math.abs(deltaY);                              // added

                // Only consider the event when the delta in the
                // desired axis is greater than the one in the other.
                if(vertical && absY > absX || !vertical && absX > absY)    // added
                    self[vertical && deltaY > 0 || !vertical && deltaX > 0 ? 'next' : 'prev']();

                e.preventDefault();
            }
        };
    }

ネイティブ ブラウザと Opera ブラウザを使用して Android でこれを試してみましたが、期待どおりに動作するようです。

于 2012-08-13T19:44:42.403 に答える
0

次の修正が見つかるまで、しばらく同じ問題に苦労していました-

初期化-

var $scroller1 = $('#outer-container1').kinetic({'y':false});

これにより、コンテナーの垂直スクロールが防止されますが、垂直スクロールがブラウザーのスクローラーに渡されません。

次に、jquery キネティック ソース コードに移動し、e.preventDefault()すべてのマウスおよびスクロール アクション イベントをコメント アウトします。

このハックは私のために働いた。 https://github.com/davetayls/jquery.kinetic/issues/33

于 2015-07-10T02:27:04.307 に答える