FullPage.jsでタッチスワイプを無効にする

Question

単一のページマーケティングサイトにFullPage.jsプラグインを使用しています。

ナビゲーションリンクを使用してサイトの周囲（すべての水平）にジャンプしているので、他のタッチ要素と干渉するようにタッチ/スワイプ（シーン間）機能を無効にしたい。

私はすべてのドキュメントに起こっていましたが、私はこれを達成する方法を見つけることができません。

任意の援助は大歓迎です。ありがとう、ジャック。

Answer 1

プラグインを初期化するときにOption autoScrolling:falseを使用するだけです。このようにしてマウスホイールがスワイプしてタッチイベントもそうではない。

マウスホイールスクロール（コンピュータ用）をスクロールしたい場合はタッチデバイス（タッチデバイス）を無効にしたい場合は、プラグインをタッチデバイス用に別の方法で初期化することをお勧めします。 そうするために、このようなもの

アップデート2016：

クラスのクラスと同様に、Options responsiveWidthまたはresponsiveHeightを使用できます。 fp-auto-height-responsive

オプションは、指定された次元のモバイルデバイスの自動変更機能を無効にします。 FullPage.jsまたはオンライン。

のexamplesフォルダで利用可能な例

responsiveSlidesを使用し、水平スライドの変換を応答側の垂直セクションに強制することもできます。これは、応答スライド拡張

を通して行うことができます。

更新SEP-2014：

---

$.fn.fullpage.setAllowScrollingという名前のメソッドは、これと同じ目的でも使用できます。タッチスクロールとマウススクロールの両方を無効にします。

更新6月-2014：

---

autoScrolling:falseは垂直スクロールのみを無効にします。 水平方向を無効にしたい場合は、今やる方法はありません。プラグインを少し変更する必要があります。

内部FullPage.jsはこれを置き換えます。

function removeTouchHandler() {
    if (isTablet) {
        $(document).off('touchstart MSPointerDown');
        $(document).off('touchmove MSPointerMove');
    }
}

.

これには：

$.fn.fullpage.removeTouchHandler = function (){ 
    if (isTablet) {
        $(document).off('touchstart MSPointerDown');
        $(document).off('touchmove MSPointerMove');
    }
};

.

そして、プラグインを初期化すると、afterRenderコールバックでその公開機能を呼び出してください。

$(document).ready(function() {
    $('#fullpage').fullpage({
        afterRender: function(){
            $.fn.fullpage.removeTouchHandler();
        }
    });
});

.

フルページを2回呼び出さないでください。初期化内にafterRender関数を追加するだけです。

Answer 2

SetAllowScrolling関数は、指示の2番目の引数も受け入れますので、左右のスクロール/スワイプを無効にするために次のことを使用できます。

$ FN.FullPage.SetallowScrolling（false、 '左、right'）;

Answer 3

2017年6月現在、以前の方法のどれも私のために働いていませんでした。私が効果的にタッチを無効にすることがわかった最も簡単な方法は以下の通りです。

jQuery.fullpage.jsの関数setAllowScrolling

を見つけるでしょう

function setAllowScrolling(value, directions){
    if(typeof directions !== 'undefined'){
        directions = directions.replace(/ /g,'').split(',');

        $.each(directions, function (index, direction){
            setIsScrollAllowed(value, direction, 'm');
        });
    }
    else if(value){
        setMouseWheelScrolling(true);
        addTouchHandler();
    }else{
        setMouseWheelScrolling(false);
        removeTouchHandler();
    }
}

.

FullPageが初期化されている場合、それは自動的にsetAllowScrolling(true)を呼び出し、上記のelse if(value)状態をトリガします。addTouchHandler()への呼び出しをコメントアウトして、それを完全に無効にしたり、呼び出されるようにある種の条件を追加したり、

var winw = $(window).width();
if (winw > 480){
    addTouchHandler();
} 

.

このメソッドでは、タップ時に左右の矢印がまだ動作しているため、水平スライドをナビゲートできます。$.fn.fullpage.setAllowScrolling(false, 'left, right');を使用すると、矢印も無効にします。