nicht angemeldet
hallo ich persönlich hab schon ein paar mal so en ausklapbares menü geschrieben. Dazu hab ich immer javascript verwendet. Bei javascript musst du einfach ein programm schreibe das bei onmouseover die untermeü anzeigt
:D
hier ein bsp fürn pulldownmenue mt jAVASCRIPT:
<!DOCTYPE>
<html>
<head>
<script language="Javascript" type="text/javascript">
<!--
z=0;
function zeigemenus1() {z++;
document.getElementById("spalte2").style.visibility = "hidden";
document.getElementById("spalte1").style.visibility = "visible";
document.getElementById("spalte3").style.visibility = "hidden";
document.getElementById("spalte4").style.visibility = "hidden";
}
function zeigemenus2() {z++;
document.getElementById("spalte1").style.visibility = "hidden";
document.getElementById("spalte2").style.visibility = "visible";
document.getElementById("spalte3").style.visibility = "hidden";
document.getElementById("spalte4").style.visibility = "hidden";
}
function zeigemenus3() {z++;
document.getElementById("spalte1").style.visibility = "hidden";
document.getElementById("spalte3").style.visibility = "visible";
document.getElementById("spalte2").style.visibility = "hidden";
document.getElementById("spalte4").style.visibility = "hidden";
}
function zeigemenus4() {z++;
document.getElementById("spalte1").style.visibility = "hidden";
document.getElementById("spalte4").style.visibility = "visible";
document.getElementById("spalte3").style.visibility = "hidden";
document.getElementById("spalte2").style.visibility = "hidden";
}
function loeschen() {
document.getElementById("spalte1").style.visibility = "hidden";
document.getElementById("spalte2").style.visibility = "hidden";
}
function z1(){z--;}
function z4(){z++;}
function test() {
if (z==0)
{
document.getElementById("spalte1").style.visibility = "hidden";
document.getElementById("spalte2").style.visibility = "hidden";
document.getElementById("spalte3").style.visibility = "hidden";
document.getElementById("spalte4").style.visibility = "hidden";
}
setTimeout("test()", 100);
}
window.setTimeout('test()',100);
//-->
</script>
<style type="text/css">
<!--
#menubar {position:absolute;top:40px;left:20;z-index:2; background:black; }
td:hover { background:#585858; }
table {font-style:Impact;}
#spalte1 {position:absolute;top:72px;left:20;z-index:2; background:black; }
#spalte2 {position:absolute;top:72px;left:182;z-index:2; background:black; }
#spalte3 {position:absolute;top:72px;left:344;z-index:2; background:black; }
#spalte4 {position:absolute;top:72px;left:506;z-index:2; background:black; }
a:link { text-decoration:none; color:#33FF33; }
a:visited {text-decoration:none; color:#33FF33; }
a:hover { text-decoration:underline; letter-spacing:0.4; font-weight:bold; }
a:active { text-decoration:underline; }
a:focus { text-decoration:none; color:#33FF33; }
//-->
</style>
</head>
<body onload="test()" >
<div id="menubar" width="100%">
<table border="0" cellspacing="0"><tr> <td OnMouseOver="zeigemenus1()" onmouseout="z1()" > <tr>
<td OnMouseOver="zeigemenus1()" onmouseout="z1()" width="160" height="30">
<center> <a href="#" >text</a> </center>
</td><td OnMouseOver="zeigemenus2()" onmouseout="z1()" width="160" height="30">
<center> <a href="#" >text</a> </center>
</td>
</td><td OnMouseOver="zeigemenus3()" onmouseout="z1()" width="160" height="30">
<center> <a href="#" >text</a> </center>
</td>
</td><td OnMouseOver="zeigemenus4()" onmouseout="z1()" width="160" height="30" class="test">
<center> <a href="#" >text</a> </center>
</td>
</tr></table>
</div>
<div id="spalte1" style="visibility:hidden" >
<table border="0" cellspacing="0" onmouseout="z1()" onmouseover="z4()" ><tr><td height="30" width="162">
<center><a href="#" target="_blank" >text</a></center>
</td></tr></table>
</div>
<div id="spalte2" style="visibility:hidden" >
<table border="0" cellspacing="0" onmouseout="z1()" onmouseover="z4()" ><tr><td height="30" width="162">
<center><a href="#" target="_blank" onmouseout="z1()" onmouseover="z4()">text</a> </center> </td></tr>
<tr><td height="30" width="162"><center><a href="#" target="_blank" onmouseout="z1()" onmouseover="z4()">text</a> </center> </td></tr>
<tr><td height="30" width="162"><center><a href="#" target="_blank" onmouseout="z1()" onmouseover="z4()">text</a> </center> </td></tr>
<tr><td height="30" width="162"><center><a href="#" target="_blank" onmouseout="z1()" onmouseover="z4()">text</a> </center> </td></tr>
</table>
</div>
<div id="spalte3" style="visibility:hidden" >
<table border="0" cellspacing="0" onmouseout="z1()" onmouseover="z4()" ><tr><td height="30" width="162">
<center><a href="#" target="_blank" onmouseout="z1()" onmouseover="z4()">text</a></center>
</td></tr></table>
</div>
<div id="spalte4" style="visibility:hidden" >
<table border="0" cellspacing="0" onmouseout="z1()" onmouseover="z4()" ><tr><td height="30" width="162">
<center><a href="#" target="_blank" onmouseout="z1()" onmouseover="z4()">text</a></center>
</td></tr></table>
</div>
</body>
</html>
ENDE :D hoffe ich hab dir gehollfen lg alex