如何停止頁面滾動...仍然允許滾動？

Question

我正在使用PhoneGap制作移動應用程序。 我有這個 -

function preventBehavior(e)
{
e.preventDefault();
};
document.addEventListener("touchmove",preventBehavior, false);

您知道如何通過拖動頁面將頁面拖離智能手機屏幕一小段距離，然后當您釋放它時它會立即向后彈出？ 而你背后看到的只是黑色？ 這就是這段代碼的意圖。 確實如此。

但它也阻止了所有標准滾動，例如滾動列表。 有誰知道解決方案？

Answer 1

Cordova 1.7+的簡單解決方案在您的Xcode項目中找到Cordova.plist。 在頂部它會說“UIWebViewBounce”。 將此設置為NO。

Answer 2

你有兩個選擇：

1. iScroll - 提供此效果的超級效果。 雖然它確實有它的局限性。

2. -webkit溢出滾動：觸摸; 在ios 5中引入了一種新的css方法它運行良好但又在phonegap中有其局限性。

我個人使用iScroll作為phonegap應用程序，如果你沒有滾動的超大項目列表，它會很有用。 如果你正在尋找一種更原生的方式，我會建議使用溢出滾動方法，這已經證明在webview中會產生一些奇怪的效果。 Phonegap使用webview vs mobile safari，所以你的支持有點不同。

iScroll - http://cubiq.org/iscroll-4 webkit-scrolling - http://johanbrook.com/browsers/native-momentum-scrolling-ios-5/

Answer 3

你應該在你的head標簽中添加它:(現在不需要你的監聽器代碼）

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

這基本上禁用了縮放（放大/縮小）和你不想要的拖動效果。 因此頁面不會滾動但仍然可以跟蹤事件觸摸事件。