在HTML5電話IOS應用程序內創建滾動Div - 無高度

Question

可以在html5 IOS應用程序中創建需要動態高度的滾動div嗎？

爲了讓我的頭痛有一些背景 - 我們的應用程序有3個主面板 - 用戶可以左右滑動顯示包含通知/設置的第一個和第三個面板（如Facebook應用程序中的所有3個外部面板是固定的位置

主面板包含6頁 - 這些都是絕對定位的div，它們通過菜單選項隱藏和顯示每個顯示的div（或頁面）需要滾動，但所有內容都是動態的 - 所以我無法設置高度

我已經發現了幾種固定高度的解決方案 - 但目前還沒有動態高度的解決方案..

有什麼建議嗎？

Answer 1

請參閱this Link

iScroll是黨的lib其良好的滾動幫助。

它沒有提供高度的滾動。 當添加滾動的dom元素時，我們只需要調用方法刷新。

Answer 2

滾動的div

在iOS 5以上版本的另一個新功能是div的終於可以滾動。爲了讓一個div滾動你只需要添加以下內容（本例中有一個固定的頭，但調整定位，以滿足您的應用程序）：

.scrollable { 
position: absolute; 
top: 50px; 
left: 0; 
right: 0; 
bottom: 0; 
overflow: scroll; 
-webkit-overflow-scrolling: touch; 
} 

這裏的竅門是添加-webkit-溢出滾動到任何你通常設置溢出的地方。蘋果公司實施的不利之處在於，當你已經處於絕對頂部或底部時，div不會像你期望的那樣反彈。它不會反彈正在滾動的div，而是反彈整個頁面並顯示瀏覽器鑲邊。這是你需要JavaScript修復的地方。

請嘗試此example的可滾動性。