Her er der en nem en som tilpasses nemt, jeg har selv brugt den - det kan ses på :
http://huset.krog-frandsen.dkKode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Tree Menu</title>
<script language="JavaScript1.2">
function doMenu(id,display) {
document.getElementById(id).style.display = display;
}
</script>
<style type="text/css">
.menu {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 16px;
color: #333366;
text-decoration: none;
}
.sub {
display: none;
color: white;
text decoration: none;
}
</style>
</head>
<body>
<div id="menuLayer" style="position: absolute; left: 30px; top: 50px; width: 200px; height: 600px; z-index: 3; visibility: visible">
<b id="menu1"><a href="#" onmousedown="doMenu('menu1sub','block');doMenu('menu2sub','none');doMenu('menu3sub','none');doMenu('menu4sub','none')">
<p class="menu">Menu 1</p></a></b>
<b id="menu1sub" class="sub">
<a href="#" >Link 1</a> <br />
<a href="#">Link 2 </a> <br />
<a href="#">Link 3</a> <br />
<a href="#">Link 4 </a> </b>
<b id="menu2" ><a href="#" onmousedown="doMenu('menu2sub','block');doMenu('menu1sub','none');doMenu('menu3sub','none');doMenu('menu4sub','none')">
<p class="menu">Menu 2</p></a></b>
<b id="menu2sub" class="sub">
<a href="#" >Link 1</a> <br />
<a href="#">Link 2 </a> <br />
<a href="#">Link 3</a> <br />
<a href="#">Link 4 </a> </b>
<b id="menu3"><a href="#" onmousedown="doMenu('menu3sub','block');doMenu('menu2sub','none');doMenu('menu1sub','none');doMenu('menu4sub','none')"> <p class="menu">Menu 3</p></a></b>
<b id="menu3sub" class="sub">
<a href="#" >Link 1</a> <br />
<a href="#">Link 2 </a> <br />
<a href="#">Link 3</a> <br />
<a href="#">Link 4 </a> </b>
<b id="menu4"><a href="#" onmousedown="doMenu('menu4sub','block');doMenu('menu2sub','none');doMenu('menu3sub','none');doMenu('menu1sub','none')">
<p class="menu">Menu 4</p></a></b>
<b id="menu4sub" class="sub">
<a href="#" >Link 1</a> <br />
<a href="#">Link 2 </a> <br />
<a href="#">Link 3</a> <br />
<a href="#">Link 4 </a> </b>
</div>
</body>
</html>