andreas: dynamisches menue

grüß euch alle ganz herzlich. bin noch recht neu im milieu. habe mich ans gestalten meiner eigenen homepage gemacht.
leider komme ich trotz fragen von freunden und suchen im selfhtml archiv nicht so recht weiter.
mein problem: beim mouse over öffnet zwar mein untermenue mit den weiteren verlinkungen, aber leider macht sich dieses menue nicht von allein wieder zu. (siehe quelltext)

<html>
<title>index</title>

<style type="text/css">
<!--
body,p { font-family:"Verdana"; font-size:8pt; color:#ffffff; }
tr,td { font-family:"Verdana"; font-size:8pt; }

a:link { color:#999999; text-decoration:none; }
a:visited { color:#999999; text-decoration:none; }
a:hover { color:#FF0000; text-decoration:none; }

input { font-family:"Verdana"; font-size:8pt; }
textarea { font-family:"Verdana"; font-size:8pt; }
select { font-family:"Verdana"; font-size:8pt; }
-->
</style>

<SCRIPT LANGUAGE="JavaScript">
<!--
var setTimer=null;
var pageLayers = null;
var parentLayer = 1;
var childLayer = 1;

if (navigator.appName=='Netscape' && document.layers!=null)
{ pageLayers = document.layers; }
else if(document.all)
{ pageLayers = document.all; }

function change_button(klick_id, hi_orlow)
{
  childLayer = klick_id;
  var hilow = hi_orlow;
  clearTimeout(setTimer);
  FlipLayer("low", "InitValue");
  FlipBild("low", parentLayer);
  FlipBild("hi", childLayer);
  parentLayer = childLayer;
}

function FlipBild(flag, nr)
{
  var extension = ".gif";
  var layer_flag = "low";
  var bild = (document.all) ? eval("document.all.bild"+nr) : eval("document.ID"+nr+".document.bild"+nr);

if(flag=="hi")
  {
    extension = "h.gif";
    layer_flag = "hi";
  }
  bild.src = "bild0"+nr+extension;
  FlipLayer(layer_flag, "WRT"+nr);
}

function FlipLayer(flag, whichLayer)
{
  if(pageLayers)
  {
    currentLayer = pageLayers[whichLayer];
    if(document.all)
    { currentLayer.style.visibility = (flag=="hi") ? "visible" : "hidden"; }
    else if(currentLayer)
    { currentLayer.visibility = (flag=="hi") ? "show" : "hide"; }
  }
}
//-->
</script>

<script language="JavaScript">
<!--

function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

// -->
</script>

<body bgcolor="#FFFFFF" link="#999999" vlink="#888888" alink="#666666">

<div id="InitValue" style="position:absolute; width:1px; height:1px; z-index:7; left: 2px; top: 18px; visibility: hidden">
</div>

<div id="Layer1" style="position:absolute; left:417px; top:35px; width:63px; height:23px; z-index:8"><a href="#" onMouseOver="change_button(1,'hi')" onMouseOut="change_button(1,'low')"><font color="#000000"><img border=0  name="bild1" src="bild01.gif" width="1" height="1" align="middle"><font size="1" face="Verdana, Arial, Helvetica, sans-serif">
  Menue</font></font></a></div>

<div id="WRT1" style="position:absolute; left:415px; top:50px; z-index:4; width: 100px; height: 100px; visibility: hidden">
  <div align="left">
    <p><font color="#999999"><font face="Verdana, Arial, Helvetica, sans-serif"><font size="-2">
 <a href="#" target="main">| Link 1</a> <br>
      <a href="#" target="main">| Link 2</a> <br>
      <a href="#" target="main">| Link 3</a>
      </font></font></font></p>
    <p>  </p>
  </div>
</div>

</body>
</html>

kann mir jemand von euch einen rat oder hinweis geben?

Vielen dank im voraus!!

ansonsten wünsche ich euch allen noch einen very nice day (oder night)

tschüß andreas

  1. Sorry, ich hab deinen Quelltext nur kurz überflogen. Ich finde diese Menüs schrecklich überflüssig. Aber trotzdem kann ich mir zum Code eineige Bemerkungen nicht verkneifen.

    body,p { font-family:"Verdana"; font-size:8pt; color:#ffffff; }
    tr,td { font-family:"Verdana"; font-size:8pt; }

    'pt' ist kein Maßeinheit für den Monitor sondern für die Druckausgabe, wo ein pt genau ein Punkt ist auf dem Moitor heissen diese Pixel.

    Deine Seite dürfte auf den meisten Rechnern nicht mehr lesbar sein mit diesne Angaben.

    <SCRIPT LANGUAGE="JavaScript">

    hier fehlt das type Attribut type="text/javascript"

    if (navigator.appName=='Netscape' && document.layers!=null)
    { pageLayers = document.layers; }
    else if(document.all)
    { pageLayers = document.all; }

    Du möchtest dieses Skript, dass lediglich auf 4'er Browser teste nicht mehr wirklich verwenden oder?

    Damit wird deine Seite in den meisten modernen Browsern unbrauchbar (ein Grund mehr solche Menüs nicht zu verwenden, es gibt aber einige mehr).

    var bild = (document.all) ? eval("document.all.bild"+nr) : eval("document.ID"+nr+".document.bild"+nr);

    eval ist evil!

    und hier absolut überflüssig. Sorgt nur für Ärger.

    if(flag=="hi")

    wenn flag wirklich ein flag ist warum nutzt du nicht true/false oder 0/1?

    function MM_reloadPage(init) {  //reloads the window if Nav4 resized

    Eine ganz üble Funktion. Sie soll suggerieren wir kümmern uns um die armen NC 4. benutzer, doch die sollten mittlerweile Wissen, welche Mängel ihr Browser hat

    <body bgcolor="#FFFFFF" link="#999999" vlink="#888888" alink="#666666">

    Das solltest du alles in den CSS Block packen, dafür ist CSS da.

    <div id="Layer1" style="position:absolute; left:417px; top:35px; width:63px; height:23px; z-index:8"><a href="#" onMouseOver="change_button(1,'hi')" onMouseOut="change_button(1,'low')"><font color="#000000"><img border=0  name="bild1" src="bild01.gif" width="1" height="1" align="middle"><font size="1" face="Verdana, Arial, Helvetica, sans-serif">
      Menue</font></font></a></div>

    font ist ein veraltetes Tag und soll nicht mehr verwendet werden -> nimm CSS dafür.

    Das Skript braucht ein Update.

    Struppi.