How to have iframe height adjust automatically based off width - Responsive iframe

Q&A about the latest versions
Post Reply
User avatar
KRitchie
Posts: 55
Joined: Tue Apr 21, 2020 10:59 am
Location: Philadelphia, PA

Mon Jan 11, 2021 11:18 pm

I feel like I am missing something obvious. I am using an iframe to bring in a slideshow that is built in a separate HTML file.

On the hotspot I have the action:
<iframe src="$(hu)" width="100%" height="100%" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>

This feeds into a Target container where I set the size of the iframe. I have width set to 70%, but no matter what I set the height to, I get extra white space below the slideshow. See below - images are blurred due to NDA.
Screen Shot 2021-01-11 at 5.08.47 PM.jpg
Screen Shot 2021-01-11 at 5.08.47 PM.jpg (429.22 KiB) Viewed 221 times
It seems like there should be some CCS code I could enter in the Height field to fix this but I cannot find anything.

Would really appreciate some insight

Thanks
- Kevin
User avatar
KRitchie
Posts: 55
Joined: Tue Apr 21, 2020 10:59 am
Location: Philadelphia, PA

Tue Jan 12, 2021 6:23 pm

The ever knowledgeable Tony Redhead has figured it out.

https://tonyredhead.com/pano2vr-little- ... HPHi4_6JBw

Thanks Tony!
User avatar
Tony
Posts: 1023
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Thu Jan 14, 2021 8:45 am

You are more than welcome :-)
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/
Post Reply