nicht angemeldet
Guten Tag,
Ich möchte sehr gerne ein Menü machen, welches, wenn man auf einen Link klickt, ein Untermenü eine Zeile darunter erscheint.
Dafür habe ich mir folgendes schon mal zusammengeschnipselt:
--------------------------------------
<SCRIPT LANGUAGE="JavaScript">
var visibleVar="null";
function init(){
if (navigator.appName == "Netscape") {
layerStyleRef="layer.";
layerRef="document.layers";
styleSwitch="";
visibleVar="show";
}else{
layerStyleRef="layer.style.";
layerRef="document.all";
styleSwitch=".style";
visibleVar="visible";
}
}
function showHideLayerSwitch(layerName){
if (eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility == visibleVar')){
hideLayer(layerName);
}else{
showLayer(layerName);
}
}
function showLayer(layerName){
eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="visible"');
}
function hideLayer(layerName)
eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"');
}
function showLayer1(layerName){
if (eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility == visibleVar')){
showLayer(layerName);
}
}
function hideLayer1(layerName){
if (eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility == visibleVar')){
hideLayer(layerName);
}
}
</SCRIPT>
<STYLE TYPE="text/css">
#pulldownButton {position: absolute; z-index: 59800; left: 100px; top: 60px;}
#pulldownMenu {position: absolute; z-index: 59900; visibility: hidden; left: 100px; top: 116px;}
#pulldownMenu1 {position: absolute; z-index: 59900; visibility: hidden; left: 100px; top: 116px;}
</STYLE>
<div id="pulldownButton" >
<a href="javascript:showHideLayerSwitch('pulldownMenu');">
<font color="#000000">Home</font></a>
<a href="javascript:showHideLayerSwitch('pulldownMenu1');">
<font color="#000000">blabla</font></a>
</div>
<div id="pulldownMenu">
<table cellpadding=1 width=300 border=0>
<tr>
<td width="100"><b><center>Die 1. Links</center></b></td>
<td width="100"><b><center>Die 2. Links</center></b></td>
<td width="100"><b><center>Die 3. Links</center></b></td>
</tr>
</table>
</div>
<div id="pulldownMenu1">
<table cellpadding=1 width=300 border=0>
<tr>
<td width="100"><b><center>DU DU DU </center></b></td>
<td width="100"><b><center>Die 2. Links</center></b></td>
<td width="100"><b><center>Die 3. Links</center></b></td>
</tr>
</table>
</div>
---------------
Allerdings habe ich jetzt das Problem, dass wenn man auf "Home" klickt und dann auf "blabla" überlagern sich die Layer, ich hätte aber lieber, das sie sich wechseln anstatt sich zu überlagern?
Weiß jemand für dieses Problem Abhilfe?
Oder gibt es elegantere und weitaus unkompliziertere Möglichkeiten???
Im voraus schon mal danke!