hjælp med fold-out menu
jeg har fundet denne menu:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><STYLE>DIV.clTop {
POSITION: absolute; WIDTH: 120px
}
DIV.clSub {
LEFT: 10px; POSITION: absolute; WIDTH: 120px
}
#divCont {
HEIGHT: 300px; LEFT: 10px; POSITION: relative; TOP: 0px; WIDTH: 170px
}
A.clMain {
COLOR: black; FONT-FAMILY: Arial, Verdana, Helvetica, Helv; FONT-SIZE: 14px; FONT-WEIGHT: bold; TEXT-DECORATION: none
}
A.clSubb {
COLOR: black; FONT-FAMILY: Arial, Verdana, Helvetica, Helv; FONT-SIZE: 14px; TEXT-DECORATION: none
}
#divMain {
POSITION: absolute
}
</STYLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<body>
<SCRIPT language=JavaScript>
/********************************************************************************
Copyright (C) 1999 Thomas Brattli
This script is made by and copyrighted to Thomas Brattli at www.bratta.com
********************************************************************************/
// Courtesy of SimplytheBest.net - http://simplythebest.net/scripts/
/************************************************************************************
This script is a "foldout" menu script, all the "foldouts" will
stay outfolded in older browsers. Works in ie4+ and ns4+.
To change where the menu appears change the left and top values of the divCont
in the stylesheets, it's currently placed relative so you can
place this menu in tables or similar if you want. Change the
text colors and size in the A.clMain and A.clSubb classes.
************************************************************************************/
/************************************************************************************
Change this to false if you want all the submenus to get unfold when you
foldout a new one.
************************************************************************************/
var stayFolded=false
/************************************************************************************
Browsercheck
************************************************************************************/
var n = (document.layers) ? 1:0;
var ie = (document.all) ? 1:0;
var browser=((n || ie) && parseInt(navigator.appVersion)>=4)
/************************************************************************************
Making cross-browser objects
************************************************************************************/
function makeMenu(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'
this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+obj+'.style')
this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('document');
this.height=n?this.ref.height:eval(obj+'.offsetHeight')
this.x=(n)? this.css.left:this.css.pixelLeft;this.y=(n)? this.css.top:this.css.pixelTop;
this.hideIt=b_hideIt; this.showIt=b_showIt; this.vis=b_vis; this.moveIt=b_moveIt
return this
}
function b_showIt(){this.css.visibility="visible"}
function b_hideIt(){this.css.visibility="hidden"}
function b_vis(){if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;}
function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}
/************************************************************************************
Initiating the page. Just add to the arrays here to get more menuitems
and add divs in the page
************************************************************************************/
function init(){
oTop=new Array()
oTop[0]=new makeMenu('divTop1','divCont')
oTop[1]=new makeMenu('divTop2','divCont')
oTop[2]=new makeMenu('divTop3','divCont')
oTop[3]=new makeMenu('divTop4','divCont')
oTop[4]=new makeMenu('divTop5','divCont')
oTop[5]=new makeMenu('divTop6','divCont')
oSub=new Array()
oSub[0]=new makeMenu('divSub1','divCont.document.divTop1')
oSub[1]=new makeMenu('divSub2','divCont.document.divTop2')
oSub[2]=new makeMenu('divSub3','divCont.document.divTop3')
oSub[3]=new makeMenu('divSub4','divCont.document.divTop4')
oSub[4]=new makeMenu('divSub5','divCont.document.divTop5')
oSub[5]=new makeMenu('divSub6','divCont.document.divTop6')
for(i=0;i<oSub.length;i++){ oSub[i].hideIt() }
for(i=1;i<oTop.length;i++){ oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height) }
}
/************************************************************************************
This is the function that changes the sub menus to folded or unfolded state.
************************************************************************************/
function menu(num){
if(browser){
if(!stayFolded){
for(i=0;i<oSub.length;i++){
if(i!=num) oSub[i].hideIt()
}
for(i=1;i<oTop.length;i++){
oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
}
}
oSub[num].vis()?oSub[num].showIt():oSub[num].hideIt()
for(i=1;i<oTop.length;i++){
if(!oSub[i-1].vis()) oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height+oSub[i-1].height)
else oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
}
}
}
//Initiating the menus onload, if it's a 4.x+ browser.
if(browser) onload=init;
</SCRIPT>
<!-- Menu start -->
<div id="divCont">
<div class="clTop" id="divTop1">
<a class="clMain" href="http://simplythebest.net#" onMouseOver="menu(0); return false">[choice
0]</a><br>
<div class="clSub" id="divSub1">
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
</div>
</div>
<div class="clTop" id="divTop2">
<a class="clMain" href="http://simplythebest.net/scripts/#" onMouseOver="menu(1); return false">[choice
1]</a><br>
<div class="clSub" id="divSub2">
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
</div>
</div>
<div class="clTop" id="divTop3">
<a class="clMain" href="http://simplythebest.net/scripts/#" onMouseOver="menu(2); return false">[choice
2]</a><br>
<div class="clSub" id="divSub3">
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
</div>
</div>
<div class="clTop" id="divTop4">
<a class="clMain" href="http://simplythebest.net" onMouseOver="menu(3); return false">[choice
3]</a><br>
<div class="clSub" id="divSub4">
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
</div>
</div>
<div class="clTop" id="divTop5">
<a class="clMain" href="http://simplythebest.net" onMouseOver="menu(4); return false">[choice
4]</a><br>
<div class="clSub" id="divSub5">
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a><br>
</div>
</div>
<div class="clTop" id="divTop6" style="width: 114; height: 35">
<a class="clMain" href="http://simplythebest.net" onMouseOver="menu(5); return false">[choice
5]</a><br>
<div class="clSub" id="divSub6">
<a class="clSubb" href="http://simplythebest.net/scripts/#">-Sub ></a>
</div>
</div>
</div>
<!-- Menu end -->
</body>
</html>
Nu er jeg bare så dårlig til at justere sådan nogle ting, så derfor siger/spørger jeg her:
jeg vil gerne have at ved
"Choice0" skal der ikke være nogen submenuer
"Choice1" skal der være 2 submenuer
"Choice2" skal der være 3 submenuer
"Choice3" skal der være 3 submenuer
"Choice4" skal der være 2 submenuer
"Choice5" skal der ikke være nogen submenuer
der skal altså være 6 menuer, som x antal submenuer....
der skal også være sådan en forsinkelse på hvordan de "folder sig sammen", sådan så hvis man går væk med musen, klapper menuen ikke samme lige med det samme. ( som på denne side: www.newermind.dk )
Kan i hjælpe mig med det ??
På forhånd tak
