DEV Community


Posted on


Dynamically change the iframe height from inside

🤔 Situation

Your page is embedded to an iframe which ID is parent-iframe, and you want to change the height by your page content.

      <iframe src="https://your.html" id="parent-iframe"></iframe>

🦄 Solution

Run a script from inside to the iframe, when the page is ready.

    <script type="text/javascript">
    $(document).ready(function() {
    $("#parent-iframe", window.parent.document).height(document.body.scrollHeight);

🔗 Parent Note

Top comments (0)

Visualizing Promises and Async/Await 🤯

async await

☝️ Check out this all-time classic DEV post