Making Content Inside an iFrame Mobile Friendly

Hello, I need some help please…

I have a virtual tour that I need to use on a client’s website. It obviously works fine on desktop as I can set the parameters of how tall/wide, yet on mobile, it doesn’t work - I need it to be responsive.

The person who created the video suggested the following, but I have no idea how to implement this using the Wix Editor. Can this be achieved using Wix Code somehow?

Code provided:

Depending on the web framework contain the iframe in a

e.g.

Then call a class for example: .riviera-map{ overflow:hidden; padding-bottom:60%; position:relative; height:0; } .riviera-map iframe{ left:0; top:0; height:100%; width:100%; position:absolute; }

Please advise, thanks in advance

Did you get the answer to your question? I have the same problem.

Wix editor doesn’t allow setting css directly.
Did you try going to your mobile editor and adjust your iframe to the desired size?

Hello, no resolve on this yet. It’s not a simple case of changing the size of the iFrame, as it is the content inside the iFrame that needs to be responsive. Changing the size of the iFrame is just going to cut content out.

I have the same problem! Tried to embed my FindPenguins site, mobile preview shows perfect and then when you check on an actual phone it’s a lie! Content within the iFrame is super zoomed in and doesn’t adjust to the size of the screen it’s being viewed on. The ‘embed webpage’ feature has the same problem.

Hi,
Have you tried using openModal method ?
Roi.

if the issue as i understood is to fit the screen try to set “100%” in both instead the fixed standard values: <iframe width=“100%” height=“100%” and then you are free to scale as you want in both versions :wink:

Changing to % doesn’t work. Tried that. Wix support says it can’t be done with iframe. Need to use API. I am presently looking for a developer to help with that as it is beyond my skill set.

Did you get the answer to your question? I have the same problem.

Hi Daniela, unfortunately not!

I have the same issue! Hope this gets figured out!!