Как скрыть адресную строку мобильного браузера?

Safari и Chrome на мобильных устройствах включают в себя видимую адресную строку при загрузке страницы. В качестве body прокрутки страницы эти браузеры будут прокручивать адресную строку с экрана, чтобы предоставить больше недвижимости на веб-сайте, как показано на этом изображении:

У меня возникает проблема с моим сайтом, позволяющим это. Я работаю над Pokedex, который содержит очень длинный список всех Pokemon. Однако, так как я настроил страницу, она не хочет прокручивать адресную строку вне поля зрения.

Мой html выглядит так:

<body>
  <app> <!-- My Angular2 tag for the app, no special styles for this -->
    <nav>...</nav> <!-- The red nav bar and hamburger menu, default bootstrap -->
    <div class="fluid-container">...</div> <!-- The container for all pokemon entries -->
  </app>
</body>

Если я перейду к абсолютному дну списка (это 721 элемент), то любая прокрутка переместит адресную строку с верхней части экрана. Если я касаюсь навигационной панели и перетаскиваю ее вверх, адресная строка перемещается с экрана. Оба они кажутся неинтуитивными способами для этого.

Я предполагаю, что каким-то образом я просматриваю тело страницы, используя javascript, который скроет его, но то, что я пробовал до сих пор, не работает. Когда я это сделал, видимой прокрутки не было.

Как прокручивать страницу достаточно, чтобы скрыть адресную строку мобильного браузера вскоре после загрузки страницы?

РЕДАКТ: Чем больше я занимаюсь этим, тем более невозможным это получается без взаимодействия с пользователем. Если мне требуется взаимодействие с пользователем, возможно ли, чтобы пользователь коснулся в центре экрана, чтобы сначала попытаться прокрутить тело, прежде чем пытаться прокручивать div со всеми элементами в нем? Если это работает так, как я думаю, это сначала сместит адресную строку в сторону, прежде чем скользить по списку. Это похоже на обратное поведение браузера по умолчанию, поэтому оно может оказаться невозможным/легким/надежным, но я готов попробовать и посмотреть, есть ли у кого-нибудь идеи.

Ответ 1

Взгляните на этот пост HTML5 - http://www.html5rocks.com/en/mobile/fullscreen/ в основном вы можете использовать JS или Fullscreen API (лучший вариант IMO) или добавьте некоторые метаданные в голову, чтобы указать, что страница является webapp

Ответ 2

Это должен быть код, который вам нужно скрыть адресную строку:

window.addEventListener("load",function() {
    setTimeout(function(){
        // This hides the address bar:
        window.scrollTo(0, 1);
    }, 0);
});

Также приятно смотреть Pokedex кстати! Надеюсь, это поможет!