Ardaric
Erfahrenes Mitglied
Warum geht folgendes Script nur im IE? Und warum geht es nur, wenn ich defer="defer" angebe (Was ist das eigentlich)
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<script type="text/javascript" defer="defer">
li = document.getElementsByTagName("li");
for(i=0;i<li.length;i++)
{
li[i].onclick = function()
{
for(n=0;n<this.childNodes.length;n++)
if(this.childNodes[n].tagName == "UL")
this.childNodes[n].style.display = "block";
}
li[i].onblur = function()
{
for(n=0;n<this.childNodes.length;n++)
if(this.childNodes[n].tagName == "UL")
this.childNodes[n].style.display = "none";
}
}
</script>
<style type="text/css" media="all">
ul { padding:0px; margin:0px; list-style-type:none; display:none; }
li { padding:0px; margin:0px; }
a {color:black; text-decoration:none;}
.motheritem { background-color:#66CCFF; margin:3px; display:block;}
/* Menüpunkt */
.motheritem > li { background-color:#66CCFF; border:0px solid red; border-bottom:none;}
/* Sub */
.motheritem * li { background-color:#FFFFFF; border:2px solid #66CCFF;}
/* Subidup */
.motheritem * li > li{ background-color:#00FF00; border:23px solid #66CCFF; }
.motheritem * li * li{ background-color:#00CC99; border:2px solid #FFFFFF;}
</style>
</head>
<body>
<div style="padding:0px;">
<ul id="menu" class="motheritem">
<li >Menüpunkt 1
<ul>
<li>Sub 1
<ul>
<li>Subidup 1</li>
<li>Subidup 2</li>
<li>Subidup 3</li>
</ul>
</li>
<li>Sub 2</li>
<li>Sub 3</li>
</ul>
</li>
<li>Menüpunkt 2
<ul>
<li>Sub 1</li>
<li>Sub 2</li>
<li>Sub 3</li>
</ul>
</li>
<li>Menüpunkt 3</li>
<li>Menüpunkt 4</li>
<li>Menüpunkt 5</li>
</ul>
</div>
</body>
</html>
