Jump to content

Issues with overlapping navigation bar on android and tabs on iOS

Michel (Starnut)

Recommended Posts

Hey guys, it's been a while and I've grown a bit rusty. I've build this small game in landscape mode, set it to SHOW_ALL scaling and now have two issues that seem related to me:

1. on Safari mobile on an iPhone 6S+ (the large one), tabs will not be hidden but, instead, overlap the game from the top.

2. on Android the software navigation bar overlaps the game from the bottom and makes it literally unplayable since the buttons are hidden under it.

(images attached to this post)

Is that a regular behavior or can I do something about it?

Here is my entire mobile scaling code and the entire HTML header I took from an older Phaser game template. What am I missing?



this.stage.disableVisibilityChange = true;
this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
this.scale.setMinMax(480, 260, 945, 530);
this.scale.pageAlignHorizontally = true;
this.scale.pageAlignVertically = true;
this.scale.forceOrientation(true, false);
this.scale.setResizeCallback(this.gameResized, this);
this.scale.enterIncorrectOrientation.add(this.enterIncorrectOrientation, this);
this.scale.leaveIncorrectOrientation.add(this.leaveIncorrectOrientation, this);


	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="chrome=1, IE=9">
	<meta name="format-detection" content="telephone=no">
	<meta name="HandheldFriendly" content="true" />
	<meta name="robots" content="noindex,nofollow" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta name="apple-mobile-web-app-title" content="Phaser App">
	<meta name="viewport" content="initial-scale=1 maximum-scale=1 user-scalable=0" />




Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...