Web sayfası gezinmeyi hızlıca kaydırın (geri ve ileri)

Question

Bir Windows telefonunda, IE'de kullanıcılar kaydırmadan kenardan geliyorsa ekrana hızlıca kaydırarak ileri geri gidebilirler. Bu OS seviyesi işlevselliği, web sayfamın UX'sini engelliyor.

Bunu devre dışı bırakabilecek herhangi bir js veya css var mı? Bazı hack de yapardı.

WindowsPhone web sitesinden bir anlık:

http://www.windowsphone.com/en-in/how-to/wp8/basics/gestures-swipe-pan-and-stretch Hala yatay kaydırma için etkin touchaction gerektiğini unutmayın: Burada

başvuru sayfasına bağlantıdır.

Answer 1

Kaydırma olayının varsayılan eylemini önlemeye ne dersin. Bir yerde senin document.ready ekleyin (bu örnekte document.ready yer verdik dikkat, sadece işlev eklenmesi gerekiyor): Bu durumda

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

Ben olay 'touchmove denir inanıyoruz Ayrıca, touchstart/touchend'in varsayılan davranışını da göz ardı etmek için bunu genişletmeniz gerekebilir, ancak% 100 emin değilim.

Answer 2

Ayrıca, geriye doğru gezinmek için hızlıca sola yapılandırılmış Mac kullanıcıları için de bir sorun. Bu ayarı devre dışı bırakamazsınız, ancak kullanıcıyı https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload adresine yönlendirmeyi istediklerini onaylama isteğinde bulunabilirsiniz.

Answer 3

kopyalayıp bu JavaScript yapıştırın:,

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; 
     } 
    } 
}); 

bunu minified istiyorsanız kopyalama ve yapıştırma bu:

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;}}});

Answer 4

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

sonuç tamamen herhangi dokunmatik olayları devre dışı bırakmak için

Answer 5

David Hill tarafından 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); 

Aslında bunun nesneleri oluşturmanın güzel bir yolu olduğunu düşünüyorum.