Php photo gallery TWG | JFUploader | TWG Flash upload | WFU | Forum
https://www.tinywebgallery.com/forum/

Setting iFrame height to percentage of viewport
https://www.tinywebgallery.com/forum/viewtopic.php?f=21&t=4071
Page 1 of 1

Author:  brightestlight [ 8. Apr 2016, 15:39 ]
Post subject:  Setting iFrame height to percentage of viewport

Hi there - Very happy with my Advanced iFrame Pro purchase, especially since I can now relay parameters!

My current shortcode looks something like this:
Code:
[advanced_iframe securitykey="xxxxxx" src="http://xxx:7778/chat27/irc.xxx.org:+6697?nick={usermeta-first_name}&#Chat27Beta" width="100%" height="600"]


My old iFrame code allowed me to set the iFrame height the a percentage of the viewport height like this, and it was perfect for my needs:

Code:
<iframe name="chatpanel" src="http://xxx:7778/chat27/irc.xxx.org:+6697?nick=xxx&#Chat27Beta" marginwidth="1" marginheight="1" scrolling="no" border="0" frameborder="0" width="100%" style="min-height: 400px; width:100%; height:80vh;"></iframe>


How would I apply the same kind of formatting to the shortcode? The below doesn't seem to want to suffice ;)

Code:
[advanced_iframe securitykey="xxxxxx" src="http://xxx:7778/chat27/irc.xxx.org:+6697?nick={usermeta-first_name}&#Chat27Beta" width="100%" height="80vh"]

Author:  TinyWebGallery [ 8. Apr 2016, 16:10 ]
Post subject:  Re: Setting iFrame height to percentage of viewport

vh is a css style. Therefore you have to apply it with style="height:80vh;"

Best, Michael

Author:  brightestlight [ 8. Apr 2016, 16:12 ]
Post subject:  Re: Setting iFrame height to percentage of viewport

Ah! Got it to work!!! I changed the shortcode to (removed the height value):

Code:
[advanced_iframe securitykey="xxxxxx" src="http://xxx:7778/chat27/irc.xxx.org:+6697?nick={usermeta-first_name}&#Chat27Beta" width="100%" ]


And added this to the Style field under the Advanced iFrame Pro Basic tab:

Code:
min-height: 400px;height:80vh;

Author:  brightestlight [ 8. Apr 2016, 16:20 ]
Post subject:  Re: Setting iFrame height to percentage of viewport

TinyWebGallery wrote:
vh is a css style. Therefore you have to apply it with style="height:80vh;"

Best, Michael


Thanks Michael! worked like a charm!!!

Page 1 of 1 All times are UTC + 1 hour [ DST ]
Powered by phpBB® Forum Software © phpBB Group
http://www.phpbb.com/