Old trick with window.scrollTo(0,1); doesn't work. And even worse, the address bar moves only a bit and gets stuck halfway out sometimes.
How to remove Address Bar in Safari in iOS?
48.3k Views Asked by firedev At
4
There are 4 best solutions below
2
On
It is a combination of many things as I have found when researching this issue for myself. Here's the code that properly works on iOS5: (I know I'm a little late, but an answer is an answer, hopefully it can help people in the future)
<!DOCTYPE html>
<html>
<head>
<title>Hide Address Bar</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
window.addEventListener("load",function() {
setTimeout(function(){
window.scrollTo(0, 0);
}, 0);
});
</script>
<style>
body { min-height: 480px; }
</style>
</head>
<body>
<h1>Content</h1>
</body>
</html>
Source: http://24ways.org/2011/raising-the-bar-on-mobile
Example: http://jsbin.com/isenax/
0
On
Since IOS7 the window.scrollTo trick doesn't work anymore. There is no work around for the moment except to invite the user to add your website to Home Screen.
http://www.mobilexweb.com/blog/safari-ios7-html5-problems-apis-review
Is it possible to hide the address bar in iOS 7 Safari?
Impossible to hide navigation bars in Safari iOS 7 for iPhone/iPod touch
0
On
On iOS 7 you can use the minimal-ui meta tag. Unfortunately, that was removed in iOS 8.
For iOS 8 there's a project called brim that is supposed to bring back the minimal-ui type functionality. It can be found here: https://github.com/gajus/brim
i guess the code should still work..
anyways here is the correct way to tell mobile safari that you want the full screen: click me
e.g. use
EDIT
Apple uses a new mobile-ui property to display a minimal UI in safari:
use it like this:
source: https://www.perpetual-beta.org/weblog/ios-7-dot-1-mobile-safari-minimal-ui.html