iPhone HTML5應用滾動問題

Question

我不知道這甚至有可能還是什麼谷歌找到它，但像您可以添加：

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

而且這將使它所以你不能滾動只能上下左右。有沒有一種方法可以使它在到達最後時不會產生超滾效應，但保持滾動然後彈出？像可可應用程序一樣，我注意到「過度滾動」有時它們具有相同的背景顏色，因此它看起來不像Safari，或者它根本就沒有做到這一點？

Answer 1

你打電話overscroll叫做反彈。不幸的是，沒有文檔記錄的方式來關閉UIWebView中的反彈。你可以看看UIScrollView的反彈相關方法。一個UIWebView擁有一個UIScrollView，但不公開它。

要防止水平滾動，您只需確保您的網頁適合視口。不合身的一個常見原因是身體邊距不爲零時的100％寬度項目。

通過向文檔中添加觸摸事件處理程序並在事件中調用preventDefault，可以完全防止滾動和跳動。如果您的網頁完全適合視口，這將有效地禁用反彈。

function stopScrolling(touchEvent) { touchEvent.preventDefault(); } 
document.addEventListener('touchstart' , stopScrolling , false); 
document.addEventListener('touchmove' , stopScrolling , false); 

編輯：

UIWebView的大部分來自Objective-C的側私人使用，但JavaScript端相當接近。如果您不控制正在加載的內容，您可以inject javascript。

Answer 2

如果您使用科爾多瓦1.7+，只需打開Cordova.plist文件，並設置關鍵UIWebViewBounce到NO

在科爾多瓦2.3+，這是現在config.xml中，你需要將其設置爲false 。

Answer 3

@ JSW189

，如果你刪除這一行：

document.addEventListener('touchstart' , stopScrolling , false); 

那麼它應該工作，我猜。我遇到了問題，我無法再按按鈕，我嘗試刪除上面的這一行，它不再滾動，我可以按下按鈕。

Answer 4

對於以前的科爾多瓦版本的解決方案是在下面的帖子：（在舊版本的科爾多瓦/回撥/ PhoneGap的或AppDelegate.m文件）http://tripleshotsoftware.blogspot.ch/2012/09/stop-uiwebview-bounce-for-cordova-based.html

變化MainViewController.m。

查找webViewDidFinishLoad，並且該方法中添加以下行：

[[theWebView.subviews objectAtIndex:0] setBounces:NO];