Using a Hidden Iframe

The script demonstrated in this portion of the Iframes Tutorial uses a hidden iframe to seamlessly[1] incorporate its content into the containing document, transferring the content of the iframed document into a div that can expand and contract according to the amount of content coming from the iframe.

Click the links below to see a demonstration and more information.

• Seamless
• New Content
• The Code

Dont' forget: An error of access denied or permission denied will be triggered if you try to use JavaScript to access the document loaded into the iframe if it is from another domain. Find out more about the same origin policy.

Other Uses for Hidden Iframes

Hidden iframes were used for ajax-like functionality before XMLHttp and the term Ajax were born. Iframes are still frequently used for this purpose, since they have the advantage of maintaining browser history.

Hidden iframes can be used to circumvent JavaScript's same origin policy. See more at Julien Lecomte's Introducing CrossFrame.

Unfortunately, hidden iframes are also used in injection attacks.

Get the Code

This tutorial's examples are available for download in a zipped file. Code presented in the Iframes Tutorial is free for all uses. Donations are always appreciated!

Back to Iframes Tutorial