New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Categories
Other Sections
Sweet Ads
Compatibility
Bookmark online:


IE5+

Floating iFrame

Author: Dynamic Drive

Description: IFRAMEs are loved for their versatility in displaying any external content on the page painlessly. Well, this cool script creates a floating iframe, so it stays static and always in view even when the page is scrolled. Display content from a separate page prominently using it, whether it's a menu, important news, or an image. Furthermore, we did all the Math for you in easily displaying the iFRAME at any one of the four corners of the page. Note that this script is only visible in IE5+ and Opera 7+. A bug in NS6+ causing iframes to not follow the page disables the script from appearing in it.

Enjoy!

Demo: To your left IE5+/Opera 7+ users!


Directions:

Simply insert the below code in the <BODY> section of your page, and change the variables inside script as explained by the comments:

Select All

Now, you may wish to create a link somewhere inside the iframe that dismisses the iframe when clicked on (as illustrated in the demo). Use a code like the following for this:

<script>
function closeiframe(){
parent.document.getElementById("masterdiv").style.display="none"
}
</script>

<a href="javascript:closeiframe()">Close iframe</a>

If you wish to display this link outside of the iframe, remove parent. from within the function above.

Enjoy!