javascript - IOSスクロールサイトの修正

Question

iOS用の視差スクロール可能サイトを作成したいのですが、デバイスがdiv内のスクロールを認識/反応できるように画面を「フリーズ」する方法を知っている人はいますか？

基本的に次のようなものが必要です-スクロール時にビューポートがショップ全体を移動せずにIpadで作業するには、http：//jsfiddle.net/9R4hZ/40/ 。

乾杯ポール

Answer 1

ビューポートdivでtouchmoveイベントをリッスンし、標準のスクロール動作を防ぎ、キープレスまたはスクロールホイールイベントをスプーフィングできます（たとえば、jQueryの.triggerメソッドを使用します）。これにより、タッチイベントを追加している間、現在のスクロール機能を維持できます。

「スクロール」が起こっている方向を取得するには、次のようなものから始めることができます。

var lastTouch;
var scrollDirection;
var viewPort = document.getElementById("view");

viewPort.addEventListener('touchmove', function(event) {

    event.preventDefault();

    if (lastTouch < event.targetTouches[0].pageY) {
        console.log("dragging down");
        scrollDirection = "up";
        //trigger up arrow keypress?

    }
    else if (lastTouch > event.targetTouches[0].pageY) {
        console.log("dragging up");
        scrollDirection = "down";
        //trigger down arrow keypress?          
    }

    lastTouch = event.targetTouches[0].pageY;
});

touchmoveイベントの発生が速すぎる可能性があるため、スクロールイベントトリガーを起動する頻度を調整する必要があります。