How To Adjust Width And Height Of Iframe To Fit With Content In It

83775/how-to-adjust-width-and-height-of-iframe-fit-with-content-in-it

• Home
• Community
• Categories
• Web Development
• Java-Script
• How to adjust width and height of iframe to fit...

How to adjust width and height of iframe to fit with content in it 0 votes

I need a solution for auto-adjusting the width and height of an iframe to barely fit its content. The point is that the width and height can be changed after the iframe has been loaded. I guess I need an event action to deal with the change in dimensions of the body contained in the iframe.

• html
• css
• javascript
• laravel
• php

Sep 4, 2020 in Java-Script by kartik • 37,520 points • 7,415 views answer comment

• flag

Your comment on this question:

Your name to display (optional):

Email me at this address if a comment is added after mine:Email me if a comment is added after mine

Privacy: Your email address will only be used for sending these notifications.

Add comment Cancel

1 answer to this question.

Your answer

Your name to display (optional):

Email me at this address if my answer is selected or commented on:Email me if my answer is selected or commented on

Privacy: Your email address will only be used for sending these notifications.

Add answer Cancel

0 votes

Hello @kartik,

<script type="application/javascript"> function resizeIFrameToFitContent( iFrame ) { iFrame.width = iFrame.contentWindow.document.body.scrollWidth; iFrame.height = iFrame.contentWindow.document.body.scrollHeight; } window.addEventListener('DOMContentLoaded', function(e) { var iFrame = document.getElementById( 'iFrame1' ); resizeIFrameToFitContent( iFrame ); // or, to resize all iframes: var iframes = document.querySelectorAll("iframe"); for( var i = 0; i < iframes.length; i++) { resizeIFrameToFitContent( iframes[i] ); } } ); </script> <iframe src="usagelogs/default.aspx" id="iFrame1"></iframe>

Hope it helps!! Thank you!!

answered Sep 4, 2020 by Niroj • 82,840 points comment

• flag
• ask related question

Your comment on this answer:

Your name to display (optional):

Email me at this address if a comment is added after mine:Email me if a comment is added after mine

Privacy: Your email address will only be used for sending these notifications.

Add comment Cancel

Related Questions In Java-Script

+1 vote 1 answer

How to implement up and down voting of a particular thread?

Hello @kartik, Yes, JavaScript is involved. There are ...READ MORE

answered Jun 3, 2020 in Java-Script by Niroj • 82,840 points • 1,421 views

• html
• css
• javascript
• php
• laravel

0 votes 1 answer

How to Store PHP variable with HTML in JavaScript in Laravel Blade Template?

Hello @kartik, The double curly brackets {{ }} will always ...READ MORE

answered Jun 11, 2020 in Java-Script by Niroj • 82,840 points • 17,341 views

• html
• css
• javascript
• laravel
• angular

0 votes 1 answer

How to retrieve config and env variable in vue component?

Hello @kartik, To access your env variables in ...READ MORE

answered Jun 11, 2020 in Java-Script by Niroj • 82,840 points • 11,159 views

• html
• css
• javascript
• laravel
• php

0 votes 1 answer

How to send data in request body with a GET when using jQuery $.ajax()?

Hello @kartik, Sending the data in your scenario,I ...READ MORE

answered Jun 18, 2020 in Java-Script by Niroj • 82,840 points • 19,683 views

• html
• css
• laravel
• javascript
• angular

+1 vote 1 answer

How to make anchor tag with routing using Laravel?

Hey @kartik, First you have to go to ...READ MORE

answered Mar 18, 2020 in Laravel by Niroj • 82,840 points • 23,136 views

• html
• css
• javascript
• laravel
• angularjs
• php

0 votes 1 answer

What is redirection in Laravel?

Named route is used to give specific ...READ MORE

answered Mar 18, 2020 in Laravel by Niroj • 82,840 points • 3,032 views

• html
• css
• javascript
• laravel
• php

0 votes 1 answer

How to install Laravel via composer?

Hello, This is simple you just need to ...READ MORE

answered Mar 23, 2020 in Laravel by Niroj • 82,840 points • 2,976 views

• html
• css
• javascript
• laravel
• php

+1 vote 1 answer

What are named routes in Laravel and How can specify route names for controller actions?

Hey @kartik, Named routing is another amazing feature of ...READ MORE

answered Mar 23, 2020 in Laravel by Niroj • 82,840 points • 44,970 views

• html
• css
• javascript
• laravel
• php

+1 vote 2 answers

How to convert entire div data into image and save it into directory without using canvas?

Hello @kartik, You can try the sample code ...READ MORE

answered Apr 29, 2020 in Java-Script by Niroj • 82,840 points • 73,171 views

• html
• css
• javascript
• angular
• nodejs

0 votes 1 answer

How to use Redirect in the new react-router-dom of Reactjs?

Hello, To navigate to another component you can ...READ MORE

answered May 18, 2020 in Java-Script by Niroj • 82,840 points • 8,798 views

• html
• css
• angular
• laravel
• javascript

Recent in Java-Script

• How to create custom pagination in JavaScript? Dec 19
• How to pass JSON data to server-side using jquery Ajax? Dec 19
• Why Would Developers Use Both jQuery and Ext JS Together? Dec 19
• How to prevent webpack from renaming js file? Dec 19
• How does async/await work in React? Dec 17

• All categories
• Artificial Intelligence (3)
• Generative AI (314)
• ChatGPT (21)
• Apache Kafka (84)
• Apache Spark (596)
• Azure (157)
• Big Data Hadoop (1,907)
• Blockchain (1,673)
• C# (141)
• C++ (272)
• Career Counselling (1,060)
• Cloud Computing (3,698)
• Cyber Security & Ethical Hacking (510)
• Data Analytics (1,266)
• Database (858)
• Data Science (78)
• DevOps & Agile (3,850)
• Digital Marketing (121)
• Events & Trending Topics (28)
• IoT (Internet of Things) (387)
• Java (1,296)
• Kotlin (8)
• Linux Administration (389)
• Machine Learning (337)
• MicroStrategy (7)
• PMP (547)
• Power BI (929)
• Python (3,223)
• RPA (653)
• SalesForce (122)
• Selenium (1,571)
• Software Testing (58)
• Tableau (608)
• Talend (73)
• TypeSript (124)
• Web Development (3,325)
• Ask us Anything! (70)
• Others (2,245)
• Mobile Development (395)
• UI UX Design (24)

×

Join the world's most active Tech Community!

Welcome back to the World's most active Tech Community!

Sign up with Gmail Sign up with Facebook

OR

Please provide a valid input Password must have

At least 1 upper-case and 1 lower-case letter

Minimum 8 characters and Maximum 50 characters

SIGN UP Already have an Edureka Account? Login Please enter a valid emailid Forgot Password? LOGIN Don’t have edureka account? Sign Up resend ? Password must have

At least 1 upper-case and 1 lower-case letter

Minimum 8 characters and Maximum 50 characters

reset password Don’t have edureka account? Sign Up reset password Don’t have edureka account? Sign Up Send Code Don’t have edureka account? Sign Up

Subscribe to our Newsletter, and get personalized recommendations.

Sign up with Google Signup with Facebook

Already have an account? Sign in.

× REGISTER FOR FREE WEBINAR X Years of Experience* Student 0-2 Years 2-5 Years 5-10 Years 10+ Years REGISTER NOW Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP "PMP®","PMI®", "PMI-ACP®" and "PMBOK®" are registered marks of the Project Management Institute, Inc. MongoDB®, Mongo and the leaf logo are the registered trademarks of MongoDB, Inc.