Remove address bar


#1

how to remove address bar in web brower application?


#2

According to StackOverflow, you should be able to use HTML5 fullscreen to hide the address bar.

The latest OpenFL should use this on HTML5 when you use stage.displayState = FULLSCREEN in compatible browsers :wink:


#3

Request for fullscreen was denied because Element.requestFullscreen() was not called from inside a short running user-generated event handler.


#4

ok i got it thank you very much


#5

unfortunately it doesnt work on ios safari browser


#6

There are hacks that worked in old versions of iOS, but I’m not sure it’s possible anymore. I only see solutions like: https://coderwall.com/p/yaro4w/fullscreen-experience-on-mobile-safari


#7

I have some issues on landscape mode with the adress bar on ios safari because Apple doesn’t support fullscreen on mobile.
My app is not properly scaled on ios safari:
I can’t see what’s under the adress bar or I can’t see the bottom of my app because my app is below the adress bar with a too high height. So 2 different annoying issues…

But I think I find a workaround, here is my code:

//add in your init method
if (Helper.isSafariMobile) {//replace by a browser sniffing
    Browser.window.addEventListener('orientationchange', onOrientationChange);
    Actuate.timer(1).onComplete(fixSafariMobile);
}
function onOrientationChange():Void
{
	if(Browser.window.orientation == -90 || Browser.window.orientation == 90)
		Actuate.timer(1).onComplete(fixSafariMobile);
}
function fixSafariMobile():Void
{
	onResize(null);//your resize method
	Browser.document.body.scrollIntoView();//force the view to move below the adress bar => fix issue 1
	Browser.document.body.style.height = Browser.window.innerHeight + "px";//innerHeight is smaller than css height property set to 100% => fix issue 2
}

I’m using a delay with Actuate because the appearance of the adress bar is animated so we need to wait to have the correct innerHeight.