How To Change The Iframe's Orientation

In my case, I have embedded a html game that developed by another organization (yes, I was authorized to do so) into a website. Both the page and the HTML game files sits in the sa

Solution 1:

This behaviour is by design.

You have to tell the page in the iframe of the orientation change. So in your host page:

window.addEventListener("orientationchange", function() {
    var iframe = document.getElementById("youriframe").contentWindow;
    iframe.postMessage({
       orientation: window.orientation
    }, 'http://the.domain.of.the.iframe.com');
}, false);

In the hosted page:

window.addEventListener("message", function( e ) {
   window.orientation = e.data.orientation;
}, false);