Hallo, ich will eine Internetseite neu gestalten und stoße bei der Navigation auf ein Problem.
Ich gehe mit der Maus über Menue 1 bis zum Unter-Menue 1.7 und will jetzt zum Menue2.
Jetzt springt der Cursor ans Ende der Navigation. Ich komme von oben nicht an Menue Punkte, gehe ich aber von unter nach oben, läuft alles sauber.
Wer kann mir den Fehler oder die fehlende Einstellung aufzeigen.
Hoffe auf eure Hilfe.
Wanderman
nachstehend der Code der Seite:
HTML
<html>
<head>
<meta http-equiv="Content-Language" content="de">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<!-- #BeginEditable "doctitle" -->
<title>navi-test</title>
<!-- #EndEditable -->
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="content-style-type" content="text/css">
<style type="text/css" media="screen">
<!--
body
{
font-family: Arial, Verdana, sans-serif;
font-size: 12px;
overflow: auto;
padding: 10px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
.menu
{
position: absolute;
z-index: 3;
top: 10px;
}
.menu li
{
width: 140px;
float: left;
}
.menu a
{
border: 0px solid #888;
background-color: #C0C0C0;
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: auto;
margin: 0px 2px;
display: block;
height: 20px;
color: #000;
}
.menu a:hover
{
background-color: #ccc;
color: #FF0000;
font-weight: bold
}
#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 10pt;
font-weight: bold;
display: none;
width: 130px;
float: left;
}
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-size: 9pt;
font-weight: normal;
padding-top: 2px;
border-top: 0px;
cursor: pointer;
}
//-->
</style>
<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}
function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
</head>
<body bgcolor="#E0E0E0" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF" background="images/SUMI_06.jpg">
<table border="0" width="900" id="table2" bgcolor="#E6E6E6" cellspacing="0" cellpadding="8" height="647">
<!-- MSTableType="layout" -->
<tr>
<td bgcolor="#CCCCCC" colspan="2" height="35"> <div class="menu" style="left: 14px; top: 67px; position:absolute; width:116px; height:416px; float:left" id="Navigation">
<ul>
<li>
<a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<font size="2">Menue1</font></a>
</font>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="">Unter-Menue 1.1</a></li>
<li><a href="">Unter-Menue 1.2</a></li>
<li><a href="">Unter-Menue 1.3</a></li>
<li><a href="">Unter-Menue 1.4</a></li>
<li><a href="">Unter-Menue 1.5</a></li>
<li><a href="">Unter-Menue 1.6</a></li>
<li><a href="">Unter-Menue 1.7</a></li>
</ul></li>
<li>
<a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<font size="2">Menue2</a></font>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="">Unter-Menue 2.1</a></li>
<li><a href="">Unter-Menue 2.2</a></li>
</ul></li>
<li>
<font size="2">
<a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
Menue 3</a>
</font>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="">Unter-Menue 3.1</a></li>
<li><a href="">Unter-Menue 3.2</a></li>
<li><a href="">Unter-Menue 3.3</a></li>
<li><a href="">Unter-Menue 3.4</a></li>
<li><a href="">Unter-Menue 3.5</a></li>
</ul></li>
<li>
<font size="2">
<a href="javascript:void(0);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
Menue 4</a>
</font>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
<li><a href="">Unter-Menue 4.1</a></li>
<li><a href="">Unter-Menue 4.2</a></li>
<li><a href="">Unter-Menue 4.3</a></li>
</ul></li>
<li>
<font size="2">
<a href="javascript:void(0);" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
Menue 5</a> </font>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
<li><a href="">Unter-Menue 5.1</a></li>
<li><a href="">Unter-Menue 5.2</a></li>
<li><a href="">Unter-Menue 5.3</a></li>
</ul></li>
</ul></div></td>
</tr>
<tr>
<td width="154" bgcolor="#C0C0C0" valign="top"> </td>
<td height="612" width="714"> </td>
</tr>
</table>
</body>
</html>