我一直在閱讀Stack Overflow,並在Google上搜索可靠的方式來隱藏iOS 7上的工具欄,因爲舊的滾動技巧不再適用。使用覆蓋hack隱藏iOS 7中的工具欄
我已經試過如下:
<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<style type="text/css">
*
{
padding: 0;
border: 0;
outline: 0;
margin: 0;
}
html,
body
{
width: 100%;
height: 100%;
overflow: hidden;
}
div.content
{
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
width: 320px;
height: 480px;
background: orange;
}
#scroller {
height: 100%;
-webkit-tap-highlight-color: rgba(0,0,0,0);
overflow: scroll;
-webkit-overflow-scrolling: touch;
width: 100%;
}
</style>
</head>
<body class="default">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
setInterval(function(){
if((window.orientation == 90 || window.orientation == -90) && window.innerHeight != window.outerHeight) {
$('#scroller').show();
} else {
$('#scroller').hide();
}
}, 1000);
</script>
<div class="content">
<div id="scroller" style="z-index: 100000;position: fixed;top:0;left:0;right:0;bottom:0;">
Scroll up!
</div>
</div>
</body>
</html>
但向上滾動從來沒有真正隱藏滾動條。 #scroller
隱藏和顯示工具欄是否可見,所以它的一半工作,但只是不隱藏,除非我彈出內容到工具欄,但如果我滾動然後工具欄再次出現。
我誤解了實現嗎?
嘿謝謝你的回覆,但是,前兩個只有在將主頁添加到主屏幕時才起作用,我不想依賴7.1。 – Cameron
據我所知,當使網站應用程序能夠和安裝在主頁上是隱藏工具欄的唯一方法。 –