This is the about page

Dynamic Web Coding Home > Tutorials > Iframes > Hidden Using a Hidden Iframe This portion of the Iframes Tutorial demonstrates and discusses some of the possible uses for hidden iframes for retrieving data from an external source to incorporate into an existing page. As was mentioned in the tutorial, the iframe should be hidden by setting its height and width to zero or visibility hidden rather than display none in the style sheet in order to ensure that it will function properly. Demonstration and Information The following lists some reasons you might

choose to make use of a hidden iframe rather than using it for its intended purposes of displaying content in an inline frame. Try the links for demonstration and further discussion of these uses. Clicking the "Load me" links retrieves a new document for the hidden iframe and displays its content in the bordered div below. * Hidden iframes can be used to load new content to seamlessly integrate into the current page. You can use this approach to avoid the need for iframe's scrollbars or for other stylistic reasons. Load me (displayed on initial page load) * Hidden iframes can be used to load new content for use with preexisting code on the page. This technique is demonstrated with dyn-web's Tooltip here. Load me * Hidden iframes are used in ajax and/or predating what is today referred to as ajax, i.e., Remote Scripting. Load me or me or

me. Each of these links requests different information from the server which you will see displayed in the div below. Load me to see more information about the code. The Code Define both a div in which to load the contents of the iframe as well as the iframe element in your markup. Default ID's are established in the code (display and buffer), but you can specify other ID's for both the iframe and div and pass them to the function in the onload attribute of the iframe. Links to load new iframes are specified as follows: A script tag for the external JavaScript file would be included in the head of your document. View or download dw_loader.js. You can use the location.replace method instead of assigning a new url to the iframe's location to avoid having the back button return to the content that the iframe previously displayed. This possibility is included in the dw_loadExternal function, commented out. The code has been tested successfully on Firefox,

Internet Explorer 5.5+, Opera and Safari. This code is provided free of charge. Donations are always appreciated! An example demonstrating

use of this code with Scrolling Div's is provided upon request to licensed users. Further information and support on the use of this code with

Tooltips is provided only to licensed users of 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. Back to Iframes Tutorial * Home * Site Map * Code o Scrolling Div’s o Tooltips o Rotate Images o FontSizer * Tutorials o Scripting Iframes o Combining Scripts o JavaScript Errors o Object Literals * Business o Terms of Use o Licensing Information o Price List/Order Form o Donations o Policies * Contact Other

Examples: * Iframe Basics * Loading New Documents * Fluid Iframe * Communicating Between Documents Page Notes: Code presented in the Iframes Tutorial is free for all uses. Donations are always appreciated! Copyright © 2001-2008 · www.dyn-web.com · All rights reserved