nicht angemeldet
Liebes Forum,
weiss einer von euch, wie ich bei folgendem Script veranlassen kann, dass nur ein Layer angezeigt wird und die übrigen Layer verschwinden?
Quelltext:
<html>
<head>
<style>
.menu
{
position: absolute;
z-index: 1;
padding:5;
border-width: 1;
border-style: ridge;
background-color: blue;
color: white;
font-weight:bold;
font-size:10pt;
}
.menu1
{
position: absolute;
z-index: 2;
padding:5;
border-width: 1;
border-style: ridge;
background-color: blue;
color: white;
font-weight:bold;
font-size:10pt;
}
.menu2
{
position: absolute;
z-index: 3;
padding:5;
border-width: 1;
border-style: ridge;
background-color: blue;
color: white;
font-weight:bold;
font-size:10pt;
}
</style>
<title>DHTML: Rolldown-Menü</title>
<meta name="author" content="unartig.de">
</head>
<body TEXT="#000000" BGCOLOR="#FFFFFF" link=white vlink=white alink=white onload="init()">
<!--
(c) unbekannt
Überarbeitet von David Hörpel
-->
<script language="JavaScript">
var mpos=new Array();
var mdir=new Array();
var maxmenus=3;
var delay=20;
function do_menu(menu)
{
for(i=0; i<maxmenus; i++)
{
if(menu!=i && mpos[i]>-122)
{
mdir[i]=-4;
if(mpos[i]>=30)
move_menu(i);
}
}
mdir[menu]=-mdir[menu];
if
(document.all)
document.all["menu"+menu].style.top=-50;
else if(document.layers)
document.layers["menu"+menu].top=-50;
else if(document.getElementById)
document.getElementById(["menu"+menu]).style.top=-50;
if(mpos[menu]<=-122 || mpos[menu]>=30)
move_menu(menu);
}
function move_menu(menu)
{
mpos[menu]+=mdir[menu];
if
(document.all)
document.all["menu"+menu].style.top= 120;
else if(document.layers)
document.layers["menu"+menu].top= 120;
else if(document.getElementById)
document.getElementById(["menu"+menu]).style.top= 120;
}
function init()
{
for(i=0; i<maxmenus; i++)
{
mpos[i]=-122;
mdir[i]=-4;
}
}
</script>
<div align="center"><center></center></div>
<!-- Blaues Menü -->
<div class="menu" style="top:0; left:10; width: 95; height:20; z-index:2" >
<a href="" onMouseover="do_menu(0)"><font color="white" face="Verdana">Menüpunkt1</font></a></div>
<div id="menu0" class="menu" style="top:-160; left:10; width: 80;">
<font face="Verdana">
<a href="#">Unterpunkt a</a><br>
Mona Lisa Overdrive<br>
Chinesische Märchen<br>
Banana Kyoshito<br>
Das ist ein Menü</font>
</div>
<!-- Oranges Menü -->
<div class="menu1" style="top: 0; left:111; z-index:2; width: 50; height:20; background: orange"><a href="" onmouseover="do_menu(1), move_menu(3)"><font face="Verdana">Filme</font></a></div>
<div id="menu1" class="menu" style="top:-122; left:111; width: 200; background: orange">
<font face="Verdana">
Gute Nacht, Mutter<br>
Scream<br>
Romeo & Julia
</font>
</div>
<!-- Rotes Menü -->
<div class="menu2" style="top:0; left:163; z-index:2; width: 50; height:20; background: red">
<a href="" onmouseover="do_menu(2)">
<font face="Verdana">Länder</font></a></div>
<div id="menu2" class="menu" style="top:-122; left:181; width: 200; background: red">
<font face="Verdana">USA, Mexiko<br>
England<br>
Spanien<br>
Thailand </font>
</div>
</body>
</html>
Ich weiss, dass es unübersichtlich ist, den ganzen Quellcode zu posten, aber ich bin der Meinung, dass dies sein muss, um den Zusammenhang zu verstehen. Es wäre schön, wenn die Lösung auch browserübergreifend wäre. Danke für die Hilfe!
Gruß David!