hier die auszüge
die php datei
<script type="text/javascript" src="menuscript01.js"></script>
</head>
<body bgcolor="#000000">
<h1>Hybrid Theory</h1>
<h3>
<ul id="containerul">
<li>1. Papercut</a><br /> </li>
<li>2. One Step Closer <br /> </li>
<li>3. With You <br /> </li>
<li>4. Points Of Authority <br /> </li>
<li>5. Crawling <br /> </li>
<li>6. Runaway <br /> </li>
<li>7. By Myself <br /> </li>
<li>8. In The End <br /> </li>
<li>9. A Place For My Head <br /> </li>
<li>10. Forgotten <br /> </li>
<li>11. Cure For The Itch <br /> </li>
<li>12. Pushing Me Away<br /></li></ul> </h3>
<script type="text/javascript">
initiate();
</script>
die css datei
#containerul li{
margin: 0 0 0 20px; (left margin für Einrückung)
color: #00AD66;
font-family: Verdana,Arial,Helvetica;
font-size: 10px;
text-decoration: none;
text-transform: uppercase;
}
die js datei
var temp, temp2, cookieArray, cookieArray2, cookieCount;
function initiate(){
cookieCount=0;
if(document.cookie){
cookieArray=document.cookie.split(";");
cookieArray2=new Array();
for(i in cookieArray){
cookieArray2[cookieArray[i].split("=")[0].replace(/ /g,"")]=cookieArray[i].split("=")[1].replace(/ /g,"");
}
}
cookieArray=(document.cookie.indexOf("state=")>=0)?cookieArray2["state"].split(","):new Array();
temp=document.getElementById("containerul");
for(var o=0;o<temp.getElementsByTagName("li").length;o++){
if(temp.getElementsByTagName("li")[o].getElementsByTagName("ul").length>0){
temp2 = document.createElement("span");
temp2.className = "symbols";
temp2.style.backgroundImage = (cookieArray.length>0)?((cookieArray[cookieCount]=="true")?"url(minus01.gif)":"url(plus01.gif)"):"url(plus01.gif)";
temp2.onclick=function(){
showhide(this.parentNode);
writeCookie();
}
temp.getElementsByTagName("li")[o].insertBefore(temp2,temp.getElementsByTagName("li")[o].firstChild)
temp.getElementsByTagName("li")[o].getElementsByTagName("ul")[0].style.display = "none";
if(cookieArray[cookieCount]=="true"){
showhide(temp.getElementsByTagName("li")[o]);
}
cookieCount++;
}
else{
temp2 = document.createElement("span");
temp2.className = "symbols";
temp2.style.backgroundImage = "url(plus01.gif)";
temp.getElementsByTagName("li")[o].insertBefore(temp2,temp.getElementsByTagName("li")[o].firstChild);
}
}
}
function showhide(el){
el.getElementsByTagName("ul")[0].style.display=(el.getElementsByTagName("ul")[0].style.display=="block")?"none":"block";
el.getElementsByTagName("span")[0].style.backgroundImage=(el.getElementsByTagName("ul")[0].style.display=="block")?"url(minus01.gif)":"url(plus01.gif)";
}
function writeCookie(){ // Runs through the menu and puts the "states" of each nested list into an array, the array is then joined together and assigned to a cookie.
cookieArray=new Array()
for(var q=0;q<temp.getElementsByTagName("li").length;q++){
if(temp.getElementsByTagName("li")[q].childNodes.length>0){
if(temp.getElementsByTagName("li")[q].childNodes[0].nodeName=="SPAN" && temp.getElementsByTagName("li")[q].getElementsByTagName("ul").length>0){
cookieArray[cookieArray.length]=(temp.getElementsByTagName("li")[q].getElementsByTagName("ul")[0].style.display=="block");
}
}
}
document.cookie="state="+cookieArray.join(",")+";expires="+new Date(new Date().getTime() + 365*24*60*60*1000).toGMTString();
}