2012-03-06 51 views
10

我有一個簡單的html5頁面,裏面有3個div。如果我只允許第三個div滾動,我會得到一些有趣的滯後,並且觸動responsivness很奇怪。有任何想法嗎?如何防止Safari Mobile(iPad)上的滾動滯後?

<html> 
<body style="overflow:hidden"> 
<div> 
    BLA1 
</div> 
<div> 
    BLA2 
</div> 
<div style="overflow: auto;"> 
    BLA3 overflow is here 
</div> 
</body> 
</html> 

回答

43

好,感謝iScroll4插件我得到了適用於iPad的Web Developpers一個新招數。 顯然,它的工作原理與此CSS方式更好:

overflow-y: scroll; 
overflow-x: hidden; 
-webkit-overflow-scrolling: touch; 

雖然這種滯後像地獄:

overflow: auto; 
+2

有沒有辦法用滾動時保持定位絕對或相對元素的消失了一兩秒鐘這種方法? – jasonmerino 2012-06-08 23:52:16

+0

@jasonmerino這是一個固定的elt滾動的已知問題。您可以在滾動後立即覆蓋元素的CSS。從來沒有嘗試過。如果您發現請在這裏留言 – TecHunter 2012-06-12 14:06:49

+2

這工作得很好!簡單的說明一下,我只需要使用-webkit-overflow-scrolling屬性,而使用overflow:auto。 – fanfavorite 2016-04-11 18:13:41