Exported html5 in iframe doesn't go fullscreen

  • Link to .capx file (required!):

    dl.dropboxusercontent.com/u/28297064/iFrame-Breakout%20Test.capx

    The link to the html that launches this iframe is - actualconcepts.com/TestTC/testFullscreen2

    Steps to reproduce:

    1. Mouseclick/touch - Browser object should trigger "request fullscreen" as per the tutorial written by Ashley, link below - scirra.com/tutorials/655/tips-on-publishing-html5-games-to-the-web

    2.

    3.

    Observed result:

    The exported html5 game is not breaking out to full screen rather it stays within the limits of the iframe boundary itself.

    Expected result:

    In the tutorial written by Ashley, link below - scirra.com/tutorials/655/tips-on-publishing-html5-games-to-the-web.

    its mentioned as below -

    ------------------------------------------------------

    It's possible for games inside iframes to switch in to fullscreen mode, where it takes up the entire monitor. To support this, your game must not be fixed size - it has to use a fullscreen mode. Then use the Browser object's Request fullscreen action in your game. Finally, you must add the allowfullscreen attribute to the iframe tag like this:

    <iframe src="http://www.mywebsite.com/mygame" allowfullscreen="true" width="600" height="400" />

    You might also want to cover some vendor prefixes since it's a relatively new HTML5 feature:

    <iframe src="http://www.mywebsite.com/mygame" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" msallowfullscreen="true" width="600" height="400" />

    With all that in place, your iframed game should now be able to "break out" in to full screen mode!

    ---------------------------------------------------------

    But the exported html5 doesnt break out to fullscreen. It just stays within the iframe.

    The link to html with iframe setting is as follows -

    actualconcepts.com/TestTC/testFullscreen2

    The link to capx is -

    dl.dropboxusercontent.com/u/28297064/iFrame-Breakout%20Test.capx

    Is this a bug or am I doing something wrong?

    Browsers affected:

    Chrome: yes

    Firefox: yes

    Internet Explorer: yes

    Operating system & service pack:

    Construct 2 version: 158 stable release

  • It's not to do with the iframe. It doesn't work in normal, non-framed preview either. You have to request fullscreen in a user input trigger, such as 'On touch' or 'On click'. The 'is in touch' and 'left button is down' conditions are just passively checked every tick and the browser doesn't let you enter fullscreen at this time, since it thinks the user probably did not request it.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Great! Thanks Ashley. I just tried with on any Touch start event and it worked! Do you think I can use this as a best practice / regular feature in all my embedded games in iframe so as to ensure the games run fullscreen? Thank you very much.

  • kmsravindra - yes, it's a good way to run embedded games fullscreen! However I'd make sure you only provide it as an option (e.g. a fullscreen button in the game), it could be annoying if every click/touch tries to force it fullscreen.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)