nicht angemeldet
Hilfe bei OnMouseover
Hallo!!
Ich hab mir ein Menü mit OnMouseover im Javascript selbst erstellt. Allerdings weiß ich nicht, wie ich das OnMouseout einbauen muss, dass die Submenüs dann evrsteckt werden. Würd mich sehr freuen, wenn mir wer sagen kann, was ich im Code dazu ergänzen muss! Danke!!
Falls jemand für das ganze OnMouseover ne Lösung hätte, wie man das ohne Javascript macht und dass es auf allen Browsern geht, würd ich mich ebenfalls freuen!! Danke für eure Hilfe!!!
Hier das Skript:
<script type="text/javascript">
<!--
window.onload=show;
function show(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
</script><style media="screen" type="text/css"><!--
body {
margin: 0;
padding: 0;
background: #BBBBEE;
font: 80% comicsans;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute; /* Menu position that can be changed at will */
top: 30;
left: 10;
}
#menu {
width: 11em;
}
#menu dt {
cursor: pointer;
margin: 2px 0;;
height: 40px;
line-height: 40px;
text-align: center;
font-weight: bold;
border-width: 2px;
border-color: #ffe #aaab9c #ccc #fff;
border-style: solid;
background: darkslateblue;
}
#menu dd {
border: 1px skyblue;
}
#menu li {
text-align: center;
background: darkslateblue;
border-width: 2px;
border-color: #ffe #aaab9c #ccc #fff;
border-style: solid;
width: 80%;
height: 75%;
margin-left: 23px;
}
#menu li a{
color: white;
text-decoration: none;
display: block;
}
#menu dt a {
color: white;
text-decoration: none;
display: block;
height: 100%;
}
#menu li a:hover, #menu dt a:hover {
background: #bbbbee;
border-width: 2px;
border-color: #aaab9c #fff #fff #ccc;
border-style: solid;
color: darkslateblue;
}
--></style><dl id="menu"> <dt onclick="javascript:show();"><strong><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/front.htm" target="mainframe">Home</a></font></strong></dt><dt onmouseover="javascript:show('smenu2');"><strong><font face="Comic Sans MS" color="#ffffff"><a>Über mich</a></font></strong></dt><dd id="smenu2">
<ul>
<li><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/steckbrief.htm" target="mainframe">Steckbrief</a></font> </li>
<li><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/erfolge.htm" target="mainframe">Erfolge</a></font> </li>
<li><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/sponsoren.htm" target="mainframe">Sponsoren</a></font> </li>
</ul>
</dd><dt onclick="javascript:show();"><strong><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/news.htm" target="mainframe">News</a></font></strong></dt><dt onmouseover="javascript:show('smenu3');"><strong><font face="Comic Sans MS" color="#ffffff"><a>Fotos</a></font></strong></dt><dd id="smenu3">
<ul> <a href="0" target="mainframe"> </a>
<li><a href="0" target="mainframe"><font face="Comic Sans MS"></font></a><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/kinderfotos.htm" target="mainframe">Kinderfotos</a></font> </li>
<li><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/privatfotos.htm" target="mainframe">Privatfotos</a></font> </li>
<li><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/springen.htm" target="mainframe">Sprungfotos</a></font> </li>
</ul>
</dd><dt onclick="javascript:show();"><strong><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/resultate.htm" target="mainframe">Resultate</a></font></strong></dt><dt onmouseover="javascript:show('smenu4');"><strong><font face="Comic Sans MS" color="#ffffff"><a>Gesamtstände</a></font></strong></dt><dd id="smenu4">
<ul>
<li><a href="0" target="mainframe"><font face="Comic Sans MS"></font></a><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/weltcupstand.htm" target="mainframe">Weltcupstand</a></font> </li>
<li><font face="Comic Sans MS"><a href="http://www.beepworld.de/members95/roli86/coc-stand.htm" target="mainframe">COC-Stand</a></font> </li>
</ul>
</dd><dt onclick="javascript:show();"><strong><font face="Comic Sans MS"><a href="http://www.gb2003.de/guestbook.php?id=47847" target="mainframe">Gästebuch</a></font></strong></dt></dl>
-
Hi,
Falls jemand für das ganze OnMouseover ne Lösung hätte, wie man das ohne Javascript macht und dass es auf allen Browsern geht, würd ich mich ebenfalls freuen!! Danke für eure Hilfe!!!
Bin jetzt nicht den ganzen Quellcode durchgegangen, aber es muesste auch mit CSS gehen.
mfG,
steckl