Archief - HTML: verschillende links naar iFramepagina

Rimpel · 5 sep 2007

Enkele jaren terug was ik wat bezig met websites maken maar door tijdsgebrek ben ik daarmee gestopt. Onlangs vroeg iemand me of ik haar site wou samensteken...gewoon haar layout die ze gemaakt had met photoshop in 'n website gieten. Bah I hate picturesites, maar 'k heb toch toegezegd.

Nu heb ik een klein probleempje bij het samensteken van die picturesite.'k probeer het zo duidelijk mogelijk te maken...'k weet zelfs niet of het mogelijk is.

- De site ziet er zo uit als we de homepage buiten beschouwing laten:
http://users.telenet.be/soul_assassin/aprildesign/index2.html
klik dus op eender welke knop...behalve op home...en de site is zoals ie hoort.
index2.html bevat dus een iframe. Elke knop uit het menu linkt dus naar de juiste pagina met de iframe als target.

- Nu, de homepage ziet er zo uit
http://users.telenet.be/soul_assassin/aprildesign
hier zou elke knop dus moeten linken naar index2.html maar wel telkens met een andere, de juiste, pagina in het iframe geladen.

Hoe kan ik de pagina die in het iframe moet geladen worden kiezen? Want momenteel linkt elke knop op de homepage dus gewoon naar index2.html met desinger.html in de iframe. (omdat dat de 1ste pagina is...dewelke ik dus heb ingevuld bij de src van de iframe)

Hopelijk is dit verstaanbaar

Rimpel · 5 sep 2007

'k heb het al gevonden....mensen die hetzelfde zochten....

some guy named Kevin zei:
Make a container file -- we'll call it container.htm in this example -- that contains an iframe named "iframe1". This is the remote page/iframe that will be used to contain the intended content pages. The name of the page to load into the iframe is passed as a parameter to container.htm, in a url string (e.g., ?pagename.htm). container.htm defines a small javascript function, called loadIframe(), that parses the query string and loads the specified page into the into the iframe. The loadIframe() function is called from the onload event of the <body> tag in container.htm. The basic html in container.htm would look something like this:
Code:
<html>
<head>
<script type="text/javascript">
function loadIframe()
{
var urlStr;
urlStr = location.search.slice(1);
window.frames.iframe1.location = urlStr;
}
</script>
</head>
<body onload = "loadIframe()">
<h3>I am the "remote" container window with the iframe</h3>
<br>
<iframe name="iframe1" id="iframe1" frameborder="1" width="750" height="200" marginwidth="20" marginheight="10" scrolling="auto"> </iframe>
</body>
</html>

Note the definition of the loadIframe() function in the <head> of container.htm.

The url property is like so: url=container.htm?contentpage.htm;... where contentpage.htm is the name of the file you want to load into the iframe.

This way, you have only one page with an iframe to worry about, and any other page can be loaded into it. A similar approach could be taken for a container page with multiple iframes, but then you'd have to pass and parse a more complex query string including iframe names and page names (like ?frame1=page1.htm&frame2=page2.htm... etc). A little more complex, but do-able.

Archief - HTML: verschillende links naar iFramepagina

Rimpel

Legacy Member

Rimpel

Legacy Member