Скрыть адресную строку в браузере мобильных устройств

Я знаю один способ сделать это.

<body onload="setTimeout(function() {window.scrollTo(0, 1)}, 100)">
...
</body>

Но это работает, только если страница достаточно велика для прокрутки. Если страница соответствует экрану, вышеуказанная функция не будет работать. Как скрыть адресную строку в этом случае? Мне нужно заставить его работать с устройствами iphone, ipad, android.

Ответы

Ответ 1

Возможно, вы можете установить минимальное расстояние на теле больше. 480px высота экрана в вертикальном режиме + 60px высота адресной строки = 540px.

Пример:

body { min-height:540px; }     
body[orient="portrait"] { min-height:540px; }
body[orient="landscape"] { min-height:400px; }

Ответ 2

iPhone:

Работает только в том случае, если мобильное "приложение" добавляется на рабочий стол (через значок "плюс" → добавить на рабочий стол)

<meta name="apple-mobile-web-app-capable" content="yes" />

У меня нет опыта работы с другими мобильными ОС, но быстрый поиск Google для скрытого браузера с url-браузером привел к аналогичному решению с вашим окном. window.scrollTo.

Ответ 3

from http://mobile.tutsplus.com/tutorials/mobile-web-apps/remove-address-bar/ Я нашел

function hideAddressBar() {
  if(!window.location.hash) {
    if(document.height < window.outerHeight)
      document.body.style.height = (window.outerHeight + 50) + 'px';
    setTimeout( function(){ 
        window.scrollTo(0, 1); 
        document.body.style.height = 'auto'; 
      }, 50 );
  }
}

Немного измененный

отлично работает в некоторых браузерах, но по крайней мере я не могу заставить его работать с Android Chrome.

Ответ 4

Просто добавьте 'BR' в конце страницы. или вы можете использовать jqueryUI с div height 100%