Dynamic Banner Display Based on Screen Orientation

[Moistoff]

Hello everyone! I have two banners, one 1920x1080 and the other 1080x1920. I need the 1920x1080 banner to be displayed on the website when the page is in landscape orientation, and the 1080x1920 banner to be displayed when the page is in portrait orientation. How can I combine these two .js scripts into a single HTML file to ensure everything displays and works correctly?

[JoãoCésar]

Hi.

Do you have one different FLA for each resolution/orientation?

Regards,

JC

[Moistoff]

Hello! 

Yes, i have 2 FLA

[JoãoCésar · Accepted solution]

OK. Great.

If you have control over the HTML template in which your banners will be displayed, I think you can just write an if statement in JavaScript to check if window.innerWidth > window.innerHeight and if it's true then the orientation is landscape and if it's false then it is portrait. There other ways of checking orientation if you prefer too.

After doing this check, if you're using an iframe to display the banner, change this iframe's source accordingly.

I'm not sure if this is what you want though.

Please let us know.

Regards,

JC

[Moistoff]

Yes, thank you, I just made a function before the start of animation 

function init() {
    var scriptSrc;
    var isLandscape = window.innerWidth > window.innerHeight;
    if (isLandscape) {
        scriptsrc='16x9.js';
    } else {
        scriptsrc='9x16.js';
    }
    loadScript(scriptSrc, function() { startAnimation(isLandscape); });
}

[JoãoCésar]

Great.

You're welcome.