HTML5實現移動應用程序標籤欄和標題欄

我創建了部分本機代碼和部分html5的iOS應用程序。一個啓動屏幕後跟一個webview，全部用於本地代碼，其餘內容由html5實現，並將顯示在webview中。在網頁視圖中，頁面分爲3部分，頂部的標題欄，中間的內容和底部的標籤欄。我希望標題欄和tabbar分別保持其位置，即webview中的頂部和底部，無論用戶如何滾動頁面，內容都是可滾動的，當然，我該如何實現？到目前爲止，我的目標是以下內容，但是當繼續滾動直到觸及頂部/底部時，標題欄頂部或Tabbar底部會出現白色間隙，就像大多數iOS應用程序一樣，我該如何避免這種情況？HTML5實現移動應用程序標籤欄和標題欄

.mobile-titlebar { 
    height: 44px; 
    border-bottom: 1px solid @border-color; 
    width: 100%; 
    position: fixed; 
    top: 0; 
    left: 0; 
} 
.page-content { 
    padding-top: 44px; 
    padding-bottom: 49px; /* Height of the footer element */ 
} 
.mobile-tabbar { 
    height: 49px; 
    width: 100%; 
    position: fixed; 
    bottom: 0; 
    left: 0; 
}

來源

2014-11-25 dulan

我設法通過添加以下行中我的iOS原生代碼來弄明白：

self.webview_main.scrollView.bounces = NO;

希望這可以幫助別人。

來源

2014-11-25 13:44:47 dulan

HTML5實現移動應用程序標籤欄和標題欄

回答

相關問題