All geek questions in one place

Hide address bar of mobile browser on chrome (android)

We have a site where with simple JavaScript

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

We hide the address bar in most browsers (safari and our own browser for Android), this JavaScript bar works fine for most, but we noticed strange behavior on chrome, the page really scrolls down, but the address bar does not work Don’t hide! After loading the page, if the user scrolls a little with his finger, the address bar is usually hidden.

I also tried scrolling the whole page using JS, with the result of a full page scroll, and the address bar is still visible ...

Does anyone know if there is some kind of trick that I forgot to use, or if this feature is simply missing in Chrome?

+5
source share
3 answers

scrollTo (0,1) is not yet supported in Chrome for Android (it was recently added and then removed). We have a FullScreen API, but this is a little heavy for what you want to achieve.

+10
source

It appears that the latest update to Chrome Mobile (July 22) disrupted the automatic hiding of the toolbar. When you scroll the page, the toolbar no longer hides. It was on my Nexus 4.

July 22 update provides full-screen mode for tablets. But I assume that they accidentally violated the function for smartphones. Fullscreen worked previously on smartphones.

Chrome Browser Play Store

+2
source

I found a way to hide the address bar after the first click

 if (document.body.webkitRequestFullScreen) { window.addEventListener('click', function(e) { if (e.target.type != 'text' && e.target.type != 'password') { body.webkitRequestFullScreen(); window.setTimeout(function() { document.webkitCancelFullScreen(); }, 500); } }, false); }
0
source

Source: https://habr.com/ru/post/957954/

More articles:


All Articles