No problem.
Hier een voorbeeld van het script maar dan in een frameset en verderop een voorbeeld maar dan met het gebruik van een IFrame.
Voor het gemak heb ik de originele scripts in een zip gezet.
======================
Voorbeeld met frames
index.html -> hierin is de frameset gedefinieerd
Banner.html -> een eventuele banner
Menu.html -> Hieron staat de menu besturing
Inhoud.html -> Hierin verschijnt de inhoud vanuit de keuze in het menu
snapshot:
-----------------------------------------
index.html
-----------------------------------------
Code:
<html>
<head>
<title>Dit is een voorbeeld met frames</title>
</head>
<frameset rows="60,*">
<frame name="Banner" scrolling="no" noresize src="Banner.html">
<frameset cols="175,*">
<frame name="Menu" src="Menu.html">
<frame name="Inhoud" src="Inhoud.html">
</frameset>
<noframes>
<p>Deze pagina gebruikt frames maar wordt niet door uw browser ondersteund.</p>
</noframes>
</frameset>
</html>
-----------------------------------------
Banner.html
-----------------------------------------
Code:
<html>
<body bgcolor="#ffffcc">
<div align="center">
<a style="font-family: Arial; font-size: 24pt; font-bold: true; color: navy">
Welkom op mijn site
</a>
</div>
</body>
</html>
-----------------------------------------
Menu.html
-----------------------------------------
Code:
<html>
<head>
<title>Test</title>
<style>
.menuStyle1
{
background-color :#000099;
color :#FFFFFF;
font-size :8pt;
font-weight :bold;
font-family :arial,helvetica,sans-serif;
width :150px;
}
.menuStyle2
{
background-color :yellow;
color :navy;
font-size :8pt;
font-weight :bold;
font-family :arial,helvetica,sans-serif;
width :150px;
}
.menuStyle3
{
background-color :lightgreen;
color :darkblue;
font-size :8pt;
font-weight :bold;
font-family :arial,helvetica,sans-serif;
width :150px;
}
body
{
background-image : url([url]http://home.wanadoo.nl/waharteveld/...dingen/back.jpg[/url]);
}
</style>
<script language="javascript">
function SelectedIndexChange(elem)
{
switch (elem.id)
{
case "Select1":
parent.Inhoud.location.href = elem.value;
break;
case "Select2":
parent.Inhoud.location.href = elem.value;
break;
case "Select3":
parent.Inhoud.location.href = elem.value;
break;
}
}
</script>
</head>
<body bgcolor="#ffffcc">
<form ID="Form1">
<div align="center">
<select id="Select1" onchange="SelectedIndexChange(this)" class="menuStyle1" NAME="Select1">
<option value="about :blank">
Ringtones.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/25_nieuwste_ringtones.htm">
25 nieuwste.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/top10.htm">
Top10.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/index%20A-Z.htm">
Index A-Z.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/op%20categorie.htm">
Op categorie.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/mijn%20top10.htm">
Mijn top10.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/top100%202003.htm">
Top100 2003.
</option>
</select>
</div>
<div align="center">
<select id="Select2" onchange="SelectedIndexChange(this)" class="menuStyle2" NAME="Select2">
<option value="http://www.msn.com">
msn
</option>
<option value="http://www.microsoft.com">
microsoft
</option>
<option value="http://www.asp.net">
asp.net
</option>
<option value="http://www.google.nl">
google
</option>
<option value="http://www.altavista.nl">
altavista
</option>
<option value="http://www.ilse.nl">
ilse
</option>
</select>
</div>
<div align="center">
<select id="Select3" onchange="SelectedIndexChange(this)" class="menuStyle3" NAME="Select3">
<option value="http://www.startpagina.nl">
Startpagina
</option>
<option value="http://www.telefoongids.nl">
Telefoongids
</option>
<option value="http://www.mysql.com">
MySql
</option>
<option value="http://www.linux.com">
Linux
</option>
<option value="http://www.sun.com">
Sun
</option>
<option value="http://www.ibm.com">
IBM
</option>
<option value="http://www.sony.com">
Sony
</option>
</select>
</div>
</form>
</body>
</html>
-----------------------------------------
Inhoud.html
-----------------------------------------
Code:
<html>
<body>
</body>
</html>
======================
Voorbeeld met een IFrame
snapshot:
-----------------------------------------
index.html
-----------------------------------------
Code:
<html>
<head>
<title>Voorbeeld met een IFrame</title>
<style>
.menuStyle1
{
background-color :#000099;
color :#FFFFFF;
font-size :8pt;
font-weight :bold;
font-family :arial,helvetica,sans-serif;
width :150px;
}
.menuStyle2
{
background-color :yellow;
color :navy;
font-size :8pt;
font-weight :bold;
font-family :arial,helvetica,sans-serif;
width :150px;
}
.menuStyle3
{
background-color :lightgreen;
color :darkblue;
font-size :8pt;
font-weight :bold;
font-family :arial,helvetica,sans-serif;
width :150px;
}
</style>
<script language="javascript">
function SelectedIndexChange(elem)
{
switch (elem.id)
{
case "Select1":
document.getElementById("iframe").src = elem.value;
break;
case "Select2":
document.getElementById("iframe").src = elem.value;
break;
case "Select3":
document.getElementById("iframe").src = elem.value;
break;
}
}
</script>
</head>
<body bgcolor="#ffffcc">
<table width="750px">
<tr>
<td> </td>
<td align="center">
<a style="font-family: Arial; font-size: 24pt; font-bold: true; color: navy">Welkom
op mijn site </a>
</td>
</tr>
<tr>
<td width="150px" valign="top">
<select id="Select1" onchange="SelectedIndexChange(this)" class="menuStyle1">
<option value="about :blank">
Ringtones.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/25_nieuwste_ringtones.htm">
25 nieuwste.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/top10.htm">
Top10.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/index%20A-Z.htm">
Index A-Z.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/op%20categorie.htm">
Op categorie.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/mijn%20top10.htm">
Mijn top10.
</option>
<option value="http://home.wanadoo.nl/waharteveld/gsmfun/ringtones/top100%202003.htm">
Top100 2003.
</option>
</select><br>
<select id="Select2" onchange="SelectedIndexChange(this)" class="menuStyle2">
<option value="http://www.msn.com">
msn
</option>
<option value="http://www.microsoft.com">
microsoft
</option>
<option value="http://www.asp.net">
asp.net
</option>
<option value="http://www.google.nl">
google
</option>
<option value="http://www.altavista.nl">
altavista
</option>
<option value="http://www.ilse.nl">
ilse
</option>
</select><br>
<select id="Select3" onchange="SelectedIndexChange(this)" class="menuStyle3">
<option value="http://www.startpagina.nl">
Startpagina
</option>
<option value="http://www.telefoongids.nl">
Telefoongids
</option>
<option value="http://www.mysql.com">
MySql
</option>
<option value="http://www.linux.com">
Linux
</option>
<option value="http://www.sun.com">
Sun
</option>
<option value="http://www.ibm.com">
IBM
</option>
<option value="http://www.sony.com">
Sony
</option>
</select>
</td>
<td>
<iframe id="iframe" scrolling="yes" width="730px" height="500px"></iframe>
</td>
</tr>
</table>
</body>
</html>
======================
Ik denk dat je nu wel hiermee vooruit kan,
en je bent niet lastig hoor, ik help een ander graag.