This is an In-Line Frame (iFrame)
Please note that not all browsers are configured to support in-line frames,
HOWEVER, thanks to the awesome work of John Davenport Scheuer at
Dynamicdrive.com,
this iFrame is rather "special", as it will automatically resize its height to
accommodate
all of the content that a page which is displayed here contains...and without
the need for an extra scroll bar!
This wonderful script
works in all current versions of Internet Explorer, FireFox, Chrome,
Opera and Safari Browsers, and also on Android phones and tablets.
I can't attest to iPhones/iPads since I don't own one (they're above my
pay-grade),
but I haven't received any complaints saying that this "flexible" iFrame
doesn't work on an iPhone/iPad.
One piece of advice
for inserting this "flexible" iFrame into any lay-out...
in order to contract properly in all Browsers for pages with less content
(shorter pages),
change the DOC Type at the top of your html code to simply <!DOCTYPE HTML> on
the pages.
Otherwise, the pages will expand, but if a shorter page is viewed
after a long one, the iFrame will
stay expanded to the length of the previous page in FireFox and Chrome Browsers.
Other than that,
the only additional requirements for this "flexible" iFrame to work
are this piece of code, inserted into the <HEAD> section of each page that will
be opened inside the iFrame
<script
type="text/javascript" src="rzPIframe.js">
/* Resize Iframe Script © John Davenport Scheuer
As first seen in http://www.dynamicdrive.com/forums
User Name: jscheuer1
This Credit Must Remain for Legal Use */
</script>
and the
rzPIframe.js
file that is included in the zipped folder with this set must be
located in the same directory/folder as the pages that reference it.
(If the .js file is located somewhere else, you MUST change the code accordingly
to the correct file path!)
In order for the page
links in the top image (or wherever you choose to place them) to load a page
into the iFrame,
give the iFrame itself a NAME (i.e. content) and set each page link's target
to reference that specified name.
EXAMPLE: <a
target="content" href="name of the page.html">Linked Image</a>
Have fun with this...and don't let anyone tell you that iFrames are a "NO-NO" (this one is a Gem!)
If you have trouble
getting it to work, please feel free to
contact me
and I'll see what I can do to help.
Button Font:
Dark Crystal
This Text Color: #DA8D31
This set is designed with one of my own Poser creations,
incorporated into one of the "Disturbed Dreams" Fantasy Backgrounds,
courtesy of Linda White
Click here to download the entire set as a zip file.