如何禁用HTML5全屏iPhone應用程序中的彈跳？

我想製作html5全屏應用程序。我製作了一個頁面，並將其添加爲我的iphone的圖標。我加元標籤：如何禁用HTML5全屏iPhone應用程序中的彈跳？

<meta name="apple-mobile-web-app-capable" content="yes"> 
<meta name="apple-mobile-web-app-status-bar-style" content="black"> 
<meta name="viewport" content="width=device-width, user-scalable=no" />

我想實現的是：在上面的黑色狀態欄（這不工作，我不知道爲什麼它仍然是默認狀態欄......任何人的想法？）沒有可能性放大（如在Facebook應用程序） - 這工作正常。

現在的問題 - 即使我的應用適合在屏幕上，我也可以在我的iPhone上滾動。它反彈回來，但我不想要這種行爲。我想禁用該功能並啓用特定div（.ui-content）的滾動功能。我怎樣才能做到這一點？

編輯： 狀態欄現在是黑色。它在一段時間後改變了。以前的版本是緩存在iphone上還是什麼？

來源

2012-03-10 Michal B.

http://www.hakoniemi.net/labs/scrollingOffset/nonbounce.html – 2013-04-07 20:54:38

這將防止滾動整個頁面

document.ontouchmove = function(e) {e.preventDefault()};

在你的情況，你想要一些div是滾動的，有的不是，你應該能夠趕上事件在其到達前文件

scrollableDiv.ontouchmove = function(e) {e.stopPropagation()};

來源

2012-03-11 02:33:50 dmanxiii

此解決方案適合您嗎？這確實停止了從safari內部運行時的彈跳，當在獨立網頁上時（通過「添加到主頁」鏈接）頁面一直彈起... – liorda 2013-04-14 18:27:52

良好的嘗試，大部分工作。除了啓用滾動的元素滾動到頂部或底部。然後反彈效果仍然被觸發。 – mrt 2013-07-29 11:15:27

儘管這樣做有效，但我遇到了一些問題，這些問題似乎導致點擊/點擊交互（如按鈕）有時會失敗（假設觸發點擊時觸摸發生任何移動）。現在我的解決方法是，如果e.target是按鈕，鏈接或輸入元素，則不要調用preventDefault。 – 2015-09-21 20:08:22

如果您使用科爾多瓦1.7+，打開Cordova.plist文件和密鑰UIWebViewBounce設置爲NO

來源

2012-09-12 18:40:54

在發佈複製和粘貼樣板/逐字回答多個問題時要小心，這些問題往往會被社區標記爲「垃圾」。如果你這樣做，那麼它通常意味着問題是重複的，所以請將它們標記爲：http://stackoverflow.com/a/12394389/419 – Kev 2012-09-12 21:58:45

對不起。 – 2012-09-13 00:30:52

這裏擴展dmanxii的做法是我們在做什麼。

$("body").on("touchmove", function (event) { 
     if ($(event.target).is(".WhatEverClass") || $(event.target).parentsUntil().is(".ParentClass")) { 
      //console.log("NOT Disabled"); 
     } 
     else { 
      //console.log("Disabled"); 
      event.preventDefault(); 
     } 
    });

來源

2017-01-19 17:10:15 AbidCharlotte49er

如何禁用HTML5全屏iPhone應用程序中的彈跳？

回答

相關問題