Support » Plugin: iframe » iFrame with html5 banner not scaling right

  • Hi,

    I’m using the iframe plugin to display a html banner on this page http://prebenthrige.dk/banner-test/. The iframe scales perfect on desktop, but when testing on mobile, the banner is not scaled down / displayed right. Is there any way to make the iframe responsive?

    Any help would be much appreciated 🙂

    Br / Prebene

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author webvitalii

    (@webvitaly)

    Hi pta74,
    I tried to test that page on mobile device and it is working fine for me.
    Can you specify which mobile device you have problem with?

    • This reply was modified 2 months, 2 weeks ago by  webvitalii.

    Hi,

    On desktop the banner looks fine:
    2018-08-27_0737

    But when I test on my iPhone I only see a part of the banner.
    2018-08-27_0738
    Is there something I can do to make it responsive?

    Br / Preben

    Plugin Author webvitalii

    (@webvitaly)

    Oh, I see the issue now.
    Unfortunately there is nothing can be done here because the embedded page is not responsive on mobile devices by itself.

    http://www.prebenthrige.dk/html5-bannere/mcb-top.html

    Hi,

    The html banner has been designed in Adobe Animation and is responsive (by width).
    When testing the banner on it’s own it looks prefect:

    2018-08-28_0957

    You can see that page here also:

    http://www.prebenthrige.dk/html5-bannere/mcb-top.html

    Is there a class I can add to the iframe plugin code, it make the iframe container responsive?

    Br / Preben

    Plugin Author webvitalii

    (@webvitaly)

    You may try to add width=”100%” to make iframe width fluid and see if that helped.

    [iframe src=”http://www.youtube.com/embed/4qsGTXLnmKs” width=”100%” height=”500″]

    My code for the banner looks like this:

    [iframe src=”http://www.prebenthrige.dk/html5-bannere/mcb-top.html” width=”100%” height=”582″]

    So I don’t understand why the iframe doesn’t scale down when displayed on mobile?

    Plugin Author webvitalii

    (@webvitaly)

    I think I found the explanation. THere is an issue with iframe on iOS.
    https://stackoverflow.com/questions/23083462/how-to-get-an-iframe-to-be-responsive-in-ios-safari

    Please try this shortcode and see if that works:

    [iframe src=”http://www.prebenthrige.dk/html5-bannere/mcb-top.html” width=”100%” height=”582″ style=”min-width:100%; max-width:100%; width:200px;”]

    • This reply was modified 2 months, 2 weeks ago by  webvitalii.

    I have tried this code:

    [iframe src=”http://www.prebenthrige.dk/html5-bannere/mcb-top.html” width=”100%” height=”582″ style=”min-width:100%; max-width:100%; width:200px;”]

    But it didn’t solve the problen. Did I set it up wrong?

    Plugin Author webvitalii

    (@webvitaly)

    Weird.
    I think you did everything properly and unfortunately I can not found what is causing the issue.
    You may try another iframe plugin and see if that works for you.
    I will try to search a solution and reply if I will found anything.

Viewing 9 replies - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.