DmitryD Posted April 23, 2014 Share Posted April 23, 2014 Hello comrades! I'm working on my new gamemaker game at the moment, and the sponsor is asking me too make the gamerunning fullscreen on mobile chrome browsers. I've tried to use the code from this article http://code.tutsplus.com/tutorials/remove-address-bar--mobile-7509but 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 Quote Link to comment Share on other sites More sharing options...
Ezelia Posted April 23, 2014 Share Posted April 23, 2014 if they only ask for chrome mobile you're very lucky since chrome support HTML5 Fullscreen API ==> 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) Quote Link to comment Share on other sites More sharing options...
DmitryD Posted April 23, 2014 Author Share Posted April 23, 2014 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 causethe 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 knowhow to do this, and how this could help. Quote Link to comment Share on other sites More sharing options...
Ezelia Posted April 24, 2014 Share Posted April 24, 2014 you can't hide the URL bar programmatically on modern chrom mobile browsers,cause the behaviour of the url bar is handled by the browser. why you don't want to use Fullscreen API ? Quote Link to comment Share on other sites More sharing options...
DmitryD Posted April 24, 2014 Author Share Posted April 24, 2014 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 Quote Link to comment Share on other sites More sharing options...
Ezelia Posted April 24, 2014 Share Posted April 24, 2014 yeah the sponsor will ask you to hide the URL bar because this was the workaround to do pseudo-fullscreen maybe he is not aware of Fullscreen API support . just talk to him about it, I'm sure he'll prefer this solution Quote Link to comment Share on other sites More sharing options...
Yanifska Posted April 12, 2015 Share Posted April 12, 2015 Hi Dmitry did you find a solution for chrome full screen on mobile ? does it work on iOs Chrome as well ? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
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.