底部的屏幕定位手機CSS

Question

我想創建一個菜單，將堅持在移動導航屏幕的底部，所以我用position: fixed在PC上，但不是移動工作。 下面是我使用的代碼：

.menu_bar { 
    background-color: #000; 
    text-align: center; 
    height: 75px; 
    width: 100%; 
    position: fixed; 
    bottom: 0; 
    display:block; 
    z-index: 9999; 
} 

Here's the demo 這裏是一個Opera Mini的emulator

任何人都知道我爲什麼不能讓它在移動工作？謝謝:)

編輯：我看到，大多數移動瀏覽器不支持position: fixed，你知道任何好的替代品嗎？也許在JQuery的幫助下？感謝

Answer 1

我只能想到給桌上的固定位置也一樣，但我不知道這會造成進一步的問題，所以你必須：

table { 
    position: fixed; 
    top: 0px 
    bottom: 75px 
} 

.menu_bar { 
    background-color: #000; 
    text-align: center; 
    height: 75px; 
    width: 100%; 
    position: fixed; 
    bottom: 0; 
    display:block; 
    z-index: 9999; 
} 

所以，你仍然可以有你菜單欄固定，但你可能需要添加一個溢出：滾動;或溢出：auto;如果內容不滾動。我建議讀入http://code.google.com/mobile/articles/webapp_fixed_ui.html來使用javascript來滾動內容，這可能會更好。