How to hide the top toolbar in safari?

Question

JavaScript

I would like help in this matter. There is a small game designed for the entire screen size, i.e. without scroll.
On the "nasty" safari I try to hide the top toolbar, but it doesn't always work.

body {
  height: 100vh;
}

.page-wrapper {
  height: calc(100vh + 1px);
}

function hiddenTopBarInBrouser () {
        if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {
            setTimeout(() => {
                window.scrollTo(0, 1);
            }, 0);
        }
    }

    window.addEventListener('load', () => hiddenTopBarInBrouser(), false);
    window.addEventListener('orientationchange', () => hiddenTopBarInBrouser(), false);
    window.addEventListener('touchstart', () => hiddenTopBarInBrouser(), false);
    window.addEventListener('touchmove', () => hiddenTopBarInBrouser(), false);
    window.addEventListener('scroll', () => hiddenTopBarInBrouser(), false);

While I thought of this solution, in Google all the same solutions based on the scroll.

When you flip the screen, the toolbar disappears, but if there is another panel with tabs, it does not disappear anymore.

When you first visit the page, it does not disappear either. Does anyone have any solutions or ideas on how else to overcome this ailment? Or is it not real at all? At one time, I saw sites that were given to me as an example that they say it works there, but I don’t know where these sites are, and most importantly, whether these solutions work.

Answer 1

If there is no scroll, then it is unrealistic. The toolbar is hidden only by scrolling down, nothing else. I hope they will write to me here that I am mistaken, but unfortunately, I am sure that this will not happen.