hammer.js - デフォルトのズーム動作が必要+スワイプ

Question

スワイプの方向に応じて、画像をスワイプすると、前の画像または次の画像に移動します。その部分は素晴らしいですが、画像を拡大する機能は削除されています。 this answerによれば、解決策はtouchAction: 'auto'を有効にすることですが、それはhammer.jsを完全に壊して、スワイプのために働かないようにします。

コード：

<script src="../js/hammer.min.js"></script> 
<script> 
$('.imagecontainer').each(function(){ 
    var options = { 
    touchAction: 'auto', 
    }; 
    var mc = new Hammer(this, options); 

    mc.on("swipeleft", function() { 
    navTo('jsnavnext'); 
    return false; 
    }); 
    mc.on("swiperight", function() { 
    navTo('jsnavprev'); 
    return false; 
    }); 
}); 
</script> 

私はピンチズームがtouchAction: 'pan-y'で可能少なくともユーザーフレンドリーな方法で仕事を得ることができます（基本的には奇抜な円の動きを作るために、ユーザが必要です）、それはありません...すばらしいです。理想的には、hammer.jsにスワイプナビゲーションだけを追加し、他のデフォルト動作には触れないようにしたいと思います。

Answer 1

私には同様の問題がありました。 divのスワイプを検出できるようにしたいと思っていたし、divのズームをつまむこともできるようにしたい。スワイプリスナーだけでズームが無効になっているようです。 touchAction:'auto'を追加すると、ズームをつまむことができましたが、スワイプアクションとスクロールの両方を実行します（スワイプアクションを発生させたいだけでした）。私がここに持っているソリューションの重要な部分は、recognizeWithを使用していて、preventDefaultをpanstartとpanmoveに呼び出してください。これは、単に希望ピンチズームで私を残し、ここ

をスワイプ私のソリューションです：私はまだhammer.jsに新しいです

var target = document.getElementById("target-div") 
    var mc = new Hammer(target, {touchAction: 'auto' }); 

    mc.add(new Hammer.Pan({ 
    direction: Hammer.DIRECTION_ALL, 
    threshold: 0 })); 

    mc.add(new Hammer.Swipe({ 
    direction: Hammer.DIRECTION_ALL, 
    threshold: 1, 
    velocity:0.1 
    })).recognizeWith(mc.get('pan')); 

    mc.on('panstart panmove', function(ev) { ev.preventDefault(); }); 

    mc.get('pinch').set({ enable: true }); 

    mc.on("pinch", function(ev) { 
    //do anything you need to here, or not 
    }); 

    mc.on("swipeleft", function(ev) { 
    //do something 
    } 

    mc.on("swiperight", function(ev) { 
    //do something 
    } 

が、私は人々がしようとしているgithubの上の問題の多くに気づきました同じ要素に複数のジェスチャを組み合わせる。私はこれが助けて欲しい！