Page 1 of 1
Make iframe automatically adjust height according to the contents
Posted: Tue May 31, 2022 7:07 am
by VPXMedia
Hi,
Could someone please share the code or suggestions for making an iframe automatically adjust its height based on the contents in WB-17 without using a scrollbar? There is no such option in the iframe properties, and I tried several suggestions and code snippets from the internet without success.
Thanks
Re: Make iframe automatically adjust height according to the contents
Posted: Tue May 31, 2022 7:53 am
by Pablo
Re: Make iframe automatically adjust height according to the contents
Posted: Tue May 31, 2022 8:54 am
by VPXMedia
Thanks Pablo. I installed the extension as specified in the PDF on the page with the inline frame as well as on the Content page and adjusted the settings, but nothing changed. The iframe height on one of the long pages is still scrolling. Disabling the "Scrolling" hides the scrollbars but strips off/hides the remaining content in the long page - (Chrome, FireFox, Edge).
I even tried different "Height Calculations" in the extension with no luck
Re: Make iframe automatically adjust height according to the contents
Posted: Tue May 31, 2022 9:32 am
by Pablo
Are you sure you have followed all instructions?
Including this?
https://github.com/davidjbradshaw/ifram ... hooting.md
Are the any error in the browser console?
Note that this is a third party script so it is provided "AS IS".
As you may have learned, resizing an inline frame can be very complicated, so that is why a third party script is required.
Re: Make iframe automatically adjust height according to the contents
Posted: Tue May 31, 2022 1:03 pm
by wwonderfull
For an iframe showing entire content data, Is this what you are looking for?
Take an empty page then take HTML object from tool box and paste the codes below
Code: Select all
<!DOCTYPE html>
<head>
<style>
#content{
min-height: 100vh;
color:#1b1b1b; /*-light black-*/
font-size: 1.1em;
background-color:#f2f0ea;/* --off- yellow-white-- */
padding:1%;
border-radius:5px;
}
</style>
<head>
<html lang = "en">
<body>
<div style="content">
<iframe style="overflow:hidden; position: absolute; display:block; min-height: 100vh; background-color: #f2f0ea; border: none;"
src="https://en.wikipedia.org/wiki/Pavel_Durov?embedded=true"
height=600%; width=100% scrolling="no" ></iframe>
</div>
</body>
</html>
test the code in w3schools
https://www.w3schools.com/html/tryit.as ... lt_default
Re: Make iframe automatically adjust height according to the contents
Posted: Wed Jun 01, 2022 7:04 am
by VPXMedia
Many thanks. The HTML code works fine. I believe the iframe resizer extension should be updated.