在滑動（後退和前進）時禁用網頁導航

在Windows手機上，在IE中，如果滑動來自邊緣，用戶可以通過在屏幕上滑動來前後移動。此操作系統級別的功能妨礙了我的網頁用戶體驗。在滑動（後退和前進）時禁用網頁導航

是否有任何js或css可以禁用它？有些黑客也會這樣做。

從WindowsPhone的網站快照： enter image description here

這裏是鏈接到參照頁：http://www.windowsphone.com/en-in/how-to/wp8/basics/gestures-swipe-pan-and-stretch

請注意，我還需要橫向滾動啓用touchaction。

來源

2015-06-04 Shekhar Joshi

你有沒有試過擺弄'-ms-scroll-chaining：none;'CSS參數？ – SzybkiSasza

這是你在找什麼？ http://stackoverflow.com/a/13709150/1540570 –

這是正確的，沒有正確的答案？ – drunkcamel

如何防止滑動事件的默認操作。某處在您的document.ready添加（注意我已經包括在這個例子中的document.ready，只需將功能添加）：

$(document).ready(function(){ $(window).on('touchmove',function(e){e.preventDefault();}); });

在這種情況下，我相信該事件被稱爲「touchmove '您可能需要將此擴展爲忽略touchstart/touchend的默認行爲，但我不能100％確定。

來源

2015-06-09 17:59:03 clovola

雖然這也禁用滾動。 –

你可以存儲最後的觸摸位置，並確定偏移量是更垂直還是更水平，比如說你有點（1,1）;如果下一次觸摸移動是（3,2），則您將知道用戶在水平方向上移動的次數多於垂直方向，在這種情況下，您會調用preventDefault（），否則將允許它。這裏有一個類似的[post]（http://stackoverflow.com/questions/13278087/determine-vertical-direction-of-a-touchmove） – clovola

對於已配置向左滑動以向後導航的Mac用戶，這也是一個問題。您無法禁用此設置，但可以提示用戶確認他們打算導航https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload。

來源

2015-06-11 04:37:37 tommyTheHitMan

複製並粘貼這個JavaScript：

var xPos = null; 
var yPos = null; 
window.addEventListener("touchmove", function (event) { 
    var touch = event.originalEvent.touches[ 0 ]; 
    oldX = xPos; 
    oldY = yPos; 
    xPos = touch.pageX; 
    yPos = touch.pageY; 
    if (oldX == null && oldY == null) { 
     return false; 
    } 
    else { 
     if (Math.abs(oldX-xPos) > Math.abs(oldY-yPos)) { 
      event.preventDefault(); 
      return false; 
     } 
    } 
});

如果你想它精縮，複製並粘貼此：

var xPos=null;var yPos=null;window.addEventListener("touchmove",function(event){var touch=event.originalEvent.touches[0];oldX=xPos;oldY=yPos;xPos=touch.pageX;yPos=touch.pageY;if(oldX==null && oldY==null){return false;}else{if(Math.abs(oldX-xPos)>Math.abs(oldY-yPos)){event.preventDefault();return false;}}});

來源

2015-06-12 20:36:23

禁用滾動以及 –

這將測量如果您在水平方向上滑動超過垂直方向，所以它不應該禁用滾動，除非你滾動彎曲！ –

-2

*{ 
    -webkit-touch-callout: none; 
}

結果是完全停用任何觸摸事件

來源

2015-07-22 13:23:08

結帳大衛·希爾10。

var elem = document.getElementById("container"); //area we don't want touch drag 

var defaultPrevent=function(e){e.preventDefault();} 
elem.addEventListener("touchstart", defaultPrevent); 
elem.addEventListener("touchmove" , defaultPrevent);

我實際上認爲這也是一種很酷的建立對象的方法。

來源

2018-02-07 21:29:53

在滑動（後退和前進）時禁用網頁導航

回答

相關問題