Hallo
Ich möchte ein Menü machen, das normalerweise "hidden" ist, und
durch den MouseOver "visible" wird.
Ich habe dabei ein ziemlich unlogisches Problem:
1)<a onMouseOver="test()">Test</a>
-> Das funktionniert ohne Problem
2)<a onMouseOver="open('menu1')">Test2</a>
-> Das funktionniert gar nicht
3)<a href="javascript:open('menu1')">Test3</a>
-> Das funktionniert wieder problemlos
- ist doch eigentlich nur eine Kombination aus 1) und 3) ?
Ich hänge den ganzen Code unten dran, aber ich glaube das Problem ist nicht im Code, weil es ja im 3) klappt.
Viele Grüsse und vielen Dank
Sara
******************************************************************
<html>
<head>
<title> Test </title>
<style type="text/css">
<!--
div.leiste { position: absolute; top: 50px; left: 20px; height: 20px; width:300px;
font-family: Arial; font-size: 10pt; background-color:silver; layer-background-color: silver;}
div.menu1 { position: absolute; top: 72px; left: 30px; height: 80px; width:110px;
visibility: hidden; font-family: Arial; font-size: 10pt; background-color:yellow; layer-background-color: yellow;}
div.menu2 { position: absolute; top: 72px; left: 150px; height: 80px; width:110px;
visibility: hidden; font-family: Arial; font-size: 10pt; background-color:yellow; layer-background-color: yellow;}
a:link { text-decoration: none; font-family: Arial, helvetica; font-size: 10pt; color:black;}
a:hover { text-decoration: none; font-family: Arial, helvetica; font-size: 10pt;}
a:active { text-decoration: none; font-family: Arial, helvetica; font-size: 10pt; color:black}
a:visited { text-decoration: none; font-family: Arial, helvetica; font-size: 10pt; color:black}
//-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
function open(menu) {
if(document.all){
document.all[menu].style.visibility ="visible";
}
if(document.layers){
document.layers[menu].visibility="visible";
}
}
function close(menu) {
if(document.all){
document.all[menu].style.visibility="hidden";
}
if(document.layers){
document.layers[menu].visibility="hidden";
}
}
function test(){
alert("Test");
}
//-->
</script>
</head>
<body>
<div id="leiste" class="leiste">
<a onMouseOver="test()">Test</a>
<a onMouseOver="open('menu1')">Test2</a>
<a href="javascript:open('menu1')">Test3</a>
</div>
<div id="menu1" class="menu1">
<a href="http://www.google.com">rtl</a>
<a href="javascript:close('menu1')" onMouseOut="close('menu1')">Menu1</a>
</div>
<div id="menu2" class="menu2">
<a href="http://www.google.com">rtl</a>
<a href="javascript:close('menu2')" onMouseOut="close('menu2')">Menu1</a>
</div>
</body>
</html>