MagistraLudi: Navigation klappt nicht aus

hallo,

ich habe mir vor einiger zeit von einem bekannten eine navigation bauen lassen, die erst aufklappt, wenn man mit der maus drüber fährt...

allerdings funktioniert das nicht im mozilla :(

es wäre sehr schön, wenn mir jemand helfen könnte.

hier der code:

<html>
<head>
 <title></title>
<SCRIPT language="JavaScript" type="text/javascript">
<!--
overFlag = "false";

function showLayer(name)
{
if (document.all) document.all[name].style.visibility="visible";
if (document.layers) document.layers[name].visibility='show';
}

function timeOutHide(layerID)
{
 window.setTimeout("hideLayer('naviLayer')",500);
}

function setOverFlag(bool)
{
 overFlag = bool;
}

function hideLayer(name)
{
if (overFlag!="true")
 {
  if (document.all) document.all[name].style.visibility="hidden";
  if (document.layers) document.layers[name].visibility='hide';
 }
}

function highlightImg(imgName,imgSrc,layerName)
{
if (document.all) document.images[imgName].src = imgSrc;
if (document.layers) document.layers[layerName].document[imgName].src = imgSrc;
}

//-->
</script>

<STYLE type="text/css">
.naviLayerStyle
{
 visibility:hidden;
 position:absolute;
 top:0px;
 left:0px;
}
</style>
</head>

<body>
<table border="0" align="left" cellpadding="0" cellspacing="0">
 <tr>
  <td>
   <table border="0" align="left" cellpadding="0" cellspacing="0" height="50">
    <tr>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_1.gif" width=89 height=18 alt="me" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_2.gif" width=87 height=18 alt="job" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_3.gif" width=87 height=18 alt="Kunst" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_4.gif" width=87 height=18 alt="Lyriks" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_5.gif" width=87 height=18 alt="Lecker!" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_6.gif" width=87 height=18 alt="Links" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_7.gif" width=87 height=18 alt="Grüße" border="0"></a></td>
     <td><A HREF="#" OnMouseOver="showLayer('naviLayer');"><img src="../../img/menue/menue_zu_8.gif" width=89 height=18 alt="Kontakt" border="0"></a></td>
    </tr>
    <tr>
     <td><img src="../../img/menue/menue_zu_unten_1.gif" width=89 height=32 alt="me" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_2.gif" width=87 height=32 alt="job" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_3.gif" width=87 height=32 alt="Kunst" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_4.gif" width=87 height=32 alt="Lyriks" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_5.gif" width=87 height=32 alt="Lecker!" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_6.gif" width=87 height=32 alt="Links" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_7.gif" width=87 height=32 alt="Grüße" border="0"></td>
     <td><img src="../../img/menue/menue_zu_unten_8.gif" width=89 height=32 alt="Kontakt" border="0"></td></tr>
   </table>
  </td>
 </tr>
 <tr>
  <td>
   <table border="0" align="left" cellpadding="0" cellspacing="0">
    <tr>
     <td><img src="../../img/menue/schlange_links_1.gif" width="71" height="42" alt="" border="0"></td>
     <td align="left"><img src="../../img/menue/kugel_klein_oben_links.gif" width=39 height=42 alt="" border="0"></td>
     <td align="left"><img src="../../img/clear.gif" width=481 height=1 alt="" border="0"></td>
     <td align="left"><img src="../../img/menue/kugel_klein_oben_rechts.gif" width=41 height=42 alt="" border="0"></td>
     <td align="left"><img src="../../img/clear.gif" width=68 height=1 alt="" border="0"></td></tr>
   </table>
  </td>
 </tr>
</table>

<DIV NAME="naviLayer" ID="naviLayer" Class="naviLayerStyle" onMouseOut="hideLayer('naviLayer');">
<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0">
 <TR>
  <TD><a href="../subindex/me_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav1','../../img/menue/menu_1_1.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav1','../../img/menue/menu_1_1_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_1_r.gif" width=89 height=50 alt="me" border="0" hspace="0" name="nav1"></A></TD>
  <TD><a href="../subindex/art_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav2','../../img/menue/menu_1_2.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav2','../../img/menue/menu_1_2_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_2_r.gif" width=87 height=50 alt="art" border="0" hspace="0" name="nav2"></A></TD>
  <TD><a href="../subindex/lyrics_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav3','../../img/menue/menu_1_3.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav3','../../img/menue/menu_1_3_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_3_r.gif" width=87 height=50 alt="lyrics" border="0" hspace="0" name="nav3"></A></TD>
  <TD><a href="../subindex/recipes_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav4','../../img/menue/menu_1_4.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav4','../../img/menue/menu_1_4_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_4_r.gif" width=87 height=50 alt="recipes" border="0" hspace="0" name="nav4"></A></TD>
  <TD><a href="../subindex/job_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav5','../../img/menue/menu_1_5.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav5','../../img/menue/menu_1_5_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_5_r.gif" width=87 height=50 alt="job" border="0" hspace="0" name="nav5"></A></TD>
  <TD><a href="../subindex/links_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav6','../../img/menue/menu_1_6.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav6','../../img/menue/menu_1_6_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_6_r.gif" width=87 height=50 alt="links" border="0" hspace="0" name="nav6"></A></TD>
  <TD><a href="../subindex/hello_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav7','../../img/menue/menu_1_7.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav7','../../img/menue/menu_1_7_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_7_r.gif" width=87 height=50 alt="hello" border="0" hspace="0" name="nav7"></A></TD>
  <TD><a href="../subindex/contact_i.html" target="_top" OnMouseOver="showLayer('naviLayer');highlightImg('nav8','../../img/menue/menu_1_8.gif','naviLayer');setOverFlag('true');" OnMouseOut="highlightImg('nav8','../../img/menue/menu_1_8_r.gif','naviLayer');setOverFlag('false');timeOutHide();"><img src="../../img/menue/menu_1_8_r.gif" width=89 height=50 alt="contact" border="0" hspace="0" name="nav8"></A></TD>
 </TR>
</table>

</div>
</body>
</html>

  1. Hi,

    allerdings funktioniert das nicht im mozilla :(

    es würde auch im IE nicht funktionieren, wenn Microsoft nicht die eigene proprietäre Technik beibehalten hätte, welche seit dem IE 5 veraltet ist.

    if (document.all) document.all[name].style.visibility="visible";
    if (document.layers) document.layers[name].visibility='show';

    Das ist a) IE 4 proprietär und b) Netscape 4 proprietär. Alle späteren Browser verwenden, so sie überhaupt DHTML können, DOM. Beschäftige Dich hiermit anhand des DHTML-Kapitels von SelfHTML.

    Cheatah

    --
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes