Browser Browser Bottom Control Panel Overlaps Content

I have a fixed positional element at the bottom of the screen that works fine except for the Android browser where the bottom control panel overlays my element. It does not even fire a window resize event to try to work with it. IOS Safari also has a bottom control panel, but it correctly clicks on my element and doesn't overlay it.

I am open to any suggestion.

+5
source share
1 answer

You can try a new screen: full screen

https://developers.google.com/web/updates/2017/04/nic58#fullscreen

When progressive web applications launch on the Android home screen, they launch in a standalone mode, similar to the application that omnibox hides. This helps create an attractive user interface and frees up screen space for content.

However, for even more impressive events, such as games, video players or other rich content, mobile user interface elements such as system bars can still be a distraction and occupy valuable pixels that you may want.

Now you can make your progressive web application completely submerged by setting the display: full screen mode to your web application manifest .

When your application starts from the main screen, all elements of the mobile interface other than the application will be hidden.

+1
source

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


All Articles