Add Iframe with Variable Heights so that no Scrollbar is ever shown?

[ad_1]

I need to integrate an iFrame onto a site I’m working on, as it’s unfortunately the only option

Some things within the iframe source “expand” when clicked, and I want to avoid the the scrollbar that pops up on the side.

Is there anyway to have the Iframe in a flexible box to avoid this?

I’ve tried height=”100%” with no success, I had to place in a large number to show it all

Using scrolling=”no” just makes it so that the bottom content is cut off

I’ve also added allow=”fullscreen” with no success

Thoughts?

[ad_2]
1 Comment
  1. You need javascript.

    so something like this would get you the height

    const x = document.querySelector(“iframe”).contentWindow; // first iframe in DOM
    let height = x.document.documentElement.scrollHeight;

    You’ll need to wait until the iframe is fully loaded, then run a function that finds the total iframe height, and then sets the iframe accordingly.. this might result in some content shift but you’re wanting to do something a little weird.

 

This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer