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 same domain.

The game was developed to support iPad but only in landscape orientation. However in a iframe, it always display the message that "Please use the landscape orientation" even if I have already done so in the iPad device. So, I assume the iframe's orientation is always portrait.

Is it possible that set a iframe's orientation manually? In my situation, I would set it as landscape orientation.

Thanks in advance.

回答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);

来源：https://stackoverflow.com/questions/18820096/how-to-change-the-iframes-orientation