Sign in to follow this  
DmitryD

Fullscreen on Chrome or how can I hide url bar? (GameMaker)

Recommended Posts

Hello comrades!

 

I'm working on my new gamemaker game at the moment, and the sponsor is asking me too make the game

running fullscreen on mobile chrome browsers.

 

I've tried to use the code from this article http://code.tutsplus.com/tutorials/remove-address-bar--mobile-7509

but seems that it doesn't work in my game, and i have no reason why(

 

Here is the body of my index file:

<body>        <div class="gm4html5_div_class" id="gm4html5_div_id">            <!-- Create the canvas element the game draws to -->            <canvas id="canvas" width="480" height="720">               <p>Your browser doesn't support HTML5 canvas.</p>            </canvas>        </div><script type="text/javascript">function hideAddressBar(){    if(!window.location.hash)    {        if(document.height <= window.outerHeight + 10)        {            document.body.style.height = (window.outerHeight + 50) +'px';            setTimeout( function(){ window.scrollTo(0, 1); }, 50 );        }        else        {            setTimeout( function(){ window.scrollTo(0, 1); }, 0 );        }    }} window.addEventListener("load", hideAddressBar );window.addEventListener("orientationchange", hideAddressBar );window.setInterval(function(){hideAddressBar()},10);</script>        <!-- Run the game code -->        <script type="text/javascript" src="html5game/Farm Jelly Puzzle.js?ZJGAC=254850927"></script>    </body>

Could you please help me ow can I run the game fullscreen on chrome?

As I understood the only function I need here is scrollTo but it doesn't work

 

 

Share this post


Link to post
Share on other sites

if they only ask for chrome mobile you're very lucky since chrome support HTML5 Fullscreen API :D ==> http://davidwalsh.name/fullscreen

 

 

but this solution don't work on iOS nor Android stock browser (Android < 4) ,

for iOS 7.1+ use "minimal-ui" meta tag

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui">

for iOS < 7.1 and older browser version there are many tricks (that don't work very well) like the solution you used above (scrollTo ...etc)

Share this post


Link to post
Share on other sites

Ty for the link Ezelia!

 

But I'm only need to hide url bar from the browser.

As I understand, my function window.scrollTo doesn't work cause

the game size is smaller than the mobile screen.

 

Could anybody help me how to fix it?

I read that I can add some margin bottom tags to the <body>, but I don't know

how to do this, and how this could help.

Share this post


Link to post
Share on other sites

Hello Ezelia,

 

Yep, I just found out that the scrollTo func only scrolls the bigger page without hiding url(

 

Fullscreen API is really awesome, I'll definitely use it in my future projects! I'm sure it's a future of html5 games :)

The sponsor was asking only to hide url bar hehe)

 

Anyway Thank You for thereply

Share this post


Link to post
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.

Guest
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.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.