觸摸設備阻止父元素滾動

我有這個搜索數百次，但我一直沒能找到一個明確的工作答案，所以我留下了一段時間，但現在我回到了這個問題仍然無法找到解決方案。觸摸設備阻止父元素滾動

我正在使用以下腳本來防止使用鼠標在瀏覽器中的父元素上滾動，但是我無法找到類似的方法來阻止父元素在TOUCH設備中滾動。

$(document).on('DOMMouseScroll mousewheel', '.parentunscroll', function(ev) { 
    var $this = $(this), 
     scrollTop = this.scrollTop, 
     scrollHeight = this.scrollHeight, 
     height = $this.height(), 
     delta = (ev.type == 'DOMMouseScroll' ? 
      ev.originalEvent.detail * -40 : 
      ev.originalEvent.wheelDelta), 
     up = delta > 0; 

    var prevent = function() { 
     ev.stopPropagation(); 
     ev.preventDefault(); 
     ev.returnValue = false; 
     return false; 
    } 

    if (!up && -delta > scrollHeight - height - scrollTop) { 
     // Scrolling down, but this will take us past the bottom. 
     $this.scrollTop(scrollHeight); 
     return prevent(); 
    } else if (up && delta > scrollTop) { 
     // Scrolling up, but this will take us past the top. 
     $this.scrollTop(0); 
     return prevent(); 
    } 
});

我特地到幾十類似的線程在這裏，但無法找到實際工作兩者兼得的解決方案：防止父母對鼠標和觸摸事件溢出的元素滾動。

希望有人已經有這個權利;我相信這會幫助很多有同樣問題的人。

來源

2013-12-08 scooterlord

你能顯示你用來防止滾動觸摸的代碼嗎？我不知道你的問題是不是由於觸摸設備也發出假的鼠標事件以確保兼容性的事實引起的，所以你需要處理和取消這兩個事件。 – GameAlchemist

嗯，我沒有任何代碼可以顯示。我所嘗試過的所有東西都沒有工作，所以我沒有保存任何東西。尋找某人爲我提供工作代碼：/ – scooterlord

我剛剛檢查了我的輸入庫：使用stopPropagation和preventDefault確保阻止在iPad4上滾動的處理程序處理觸摸開始/移動/結束/取消。如果我理解的很好，你不想總是阻止滾動，但只是在......當我們達到開始或結束時已經不可能了？還是我錯過了什麼？ – GameAlchemist

我沒有答案，但由於沒有人發帖，我只會告訴我這樣做的方式：
1）觸摸事件，你有一個滾動事件，但它被提出在滾動開始後，即使您以後再糾正文檔滾動位置，屏幕上也會出現一些非常煩人的動作。
2）我認爲走的路要做和鼠標一樣的...除了你沒有touchscroll事件...所以你必須'手動'檢測到它，如果你看到它，取消它頂部/底部已經達到。
一個困難的解決方案。

你可能想檢查那個庫，但是我知道的庫會警告你一個卷軸，但不會讓你取消它（就像情況下（1）那樣已經太遲了）。

希望有人會建議更簡單的方法/正確的庫...

來源

2013-12-09 19:29:59 GameAlchemist

謝謝你的努力。正如你所說有人希望會回答。我很驚訝沒有人需要類似的東西和/或有解決方案。 – scooterlord

觸摸設備阻止父元素滾動

回答

相關問題