[JavaScript] Onmouseover funktioniert nicht

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [JavaScript] Onmouseover funktioniert nicht

    Hallo,

    ich hab da ein Problem mit meiner Navigationsleiste.
    Unter www.dsc.antlerslax.com/hockey.php findet ihr links eine Navigationsleiste. Diese sollte eigentlich in alle bereichen bei mouseover auf grau wechseln. Sie tut es aber nur in den Untermenüs und ich weiß nicht warum.

    Das Menü wird über die externe Datei menu_hockey.php eingebunden:

    <?php ?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>DÜSSELDORFER SPORT-CLUB 1899 e.V.</title>
    <link href="style.css" rel="stylesheet" type="text/css">
    </head>
    <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <span class="nav04" id="a" onclick="qwer=1;vor(),merker=1;dara()">
    <span id="as"></span>Herren</span><br>
    <span id="a1" style="display:none;"><a href="hockey_herren_erste.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;1. Herren</a></span>
    <span id="a2" style="display:none;"><a href="hockey_herren_zweite.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;2. Herren</a></span>
    <span id="a3" style="display:none;"><a href="hockey_herren_dritte.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;3. Herren</a></span>
    <span id="a4" style="display:none;"><a href="hockey_herren_daddler.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Düssel Daddler</a></span>
    <img src="img/cut_leiste_a.gif"><br>
    <span class="nav04" id="b" onclick="qwer=2;vor(),merker=2;dara()">
    <span id="bs"></span>Damen</span><br>
    <span id="b1" style="display:none;"><a href="hockey_damen_erste.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;1. Damen</a></span>
    <span id="b2" style="display:none;"><a href="hockey_damen_zweite.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;2. Damen</a></span>
    <img src="img/cut_leiste_a.gif"><br>
    <span class="nav04" id="d" onclick="qwer=4;vor(),merker=4;dara()">
    <span id="ds"></span>Männliche Jugend</span><br>
    <span id="d1" style="display:none;"><a href="hockey_mjugend_a.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Jugend A</a></span>
    <span id="d2" style="display:none;"><a href="hockey_mjugend_b.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Jugend B</a></span>
    <span id="d3" style="display:none;"><a href="hockey_knaben_a.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Knaben A</a></span>
    <span id="d4" style="display:none;"><a href="hockey_knaben_b.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Knaben B</a></span>
    <span id="d5" style="display:none;"><a href="hockey_knaben_c.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Knaben C</a></span>
    <span id="d6" style="display:none;"><a href="hockey_knaben_d.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Knaben D</a></span>
    <span id="d7" style="display:none;"><a href="hockey_minis.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Minis</a></span>
    <img src="img/cut_leiste_a.gif"><br>
    <span id="c" class="nav04" onclick="qwer=3;vor(),merker=3;dara()">
    <span id="cs"></span>Weibliche Jugend</span><br>
    <span id="c1" style="display:none;"><a href="hockey_wjugend_b.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Jugend B</a></span>
    <span id="c2" style="display:none;"><a href="hockey_maedchen_a.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Mädchen A</a></span>
    <span id="c3" style="display:none;"><a href="hockey_maedchen_b.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Mädchen B</a></span>
    <span id="c4" style="display:none;"><a href="hockey_maedchen_c.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Mädchen C</a></span>
    <span id="c5" style="display:none;"><a href="hockey_maedchen_a.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Mädchen D</a></span>
    <span id="c6" style="display:none;"><a href="hockey_minis.php" target="_self" class="nav04">&nbsp;&nbsp;&nbsp;Minis</a></span>
    <img src="img/cut_leiste_a.gif"><br>
    <span id="c" class="nav04" onclick="qwer=5;vor(),merker=5;dara()">
    <span id="cs"></span><a href="hockey_reise.php" target="_self" class="nav04">Reiseteams</a></span><br>
    <img src="img/cut_leiste_a.gif"><br>
    <span id="c" class="nav04" onclick="qwer=6;vor(),merker=6;dara()">
    <span id="cs"></span><a href="hockey_eltern.php" target="_self" class="nav04">Elternhockey</a></span><br>
    <img src="img/cut_leiste_a.gif"><br>
    <span id="c" class="nav04" onclick="qwer=7;vor(),merker=7;dara()">
    <span id="cs"></span><a href="hockey_erfolg.php" target="_self" class="nav04">Sportliche Erfolge</a></span>
    <img src="img/cut_leiste_a.gif"><br>
    </body>
    </html>

    Das aufgerufene Javascript auf der entsprechenden Seite lautet:

    <script language="JavaScript">
    merker=0;
    function aw() {
    if(merker==1) {
    if(document.all.a1.style.display=='none') { document.all.a1.style.display='block'; document.all.a2.style.display='block'; document.all.a3.style.display='block'; document.all.a4.style.display='block'; }
    else { document.all.a1.style.display='none'; document.all.a2.style.display='none'; document.all.a3.style.display='none'; document.all.a4.style.display='none'; }
    }
    }
    function bw() {
    if(merker==2) {
    if(document.all.b1.style.display=='none') { document.all.b1.style.display='block'; document.all.b2.style.display='block'; }
    else { document.all.b1.style.display='none'; document.all.b2.style.display='none'; }
    }
    }
    function cw() {
    if(merker==3) {
    if(document.all.c1.style.display=='none') { document.all.c1.style.display='block'; document.all.c2.style.display='block'; document.all.c3.style.display='block'; document.all.c4.style.display='block'; document.all.c5.style.display='block'; document.all.c6.style.display='block'; }
    else { document.all.c1.style.display='none'; document.all.c2.style.display='none'; document.all.c3.style.display='none'; document.all.c4.style.display='none'; document.all.c5.style.display='none'; document.all.c6.style.display='none'; }
    }
    }
    function dw() {
    if(merker==4) {
    if(document.all.d1.style.display=='none') { document.all.d1.style.display='block'; document.all.d2.style.display='block'; document.all.d3.style.display='block'; document.all.d4.style.display='block'; document.all.d5.style.display='block'; document.all.d6.style.display='block'; document.all.d7.style.display='block'; }
    else { document.all.d1.style.display='none'; document.all.d2.style.display='none'; document.all.d3.style.display='none'; document.all.d4.style.display='none'; document.all.d5.style.display='none'; document.all.d6.style.display='none'; document.all.d7.style.display='none'; }
    }
    }
    function dara() {
    if(merker==1) { aw(); } else { document.all.a1.style.display='none'; document.all.a2.style.display='none'; document.all.a3.style.display='none'; document.all.a4.style.display='none'; }
    if(merker==2) { bw(); } else { document.all.b1.style.display='none'; document.all.b2.style.display='none'; }
    if(merker==3) { cw(); } else { document.all.c1.style.display='none'; document.all.c2.style.display='none'; document.all.c3.style.display='none'; document.all.c4.style.display='none'; document.all.c5.style.display='none'; document.all.c6.style.display='none'; }
    if(merker==4) { dw(); } else { document.all.d1.style.display='none'; document.all.d2.style.display='none'; document.all.d3.style.display='none'; document.all.d4.style.display='none'; document.all.d5.style.display='none'; document.all.d6.style.display='none'; document.all.d7.style.display='none'; }
    }
    qwer=0;
    function vor() {
    if(qwer==1 && document.all.as.innerHTML==" ") { document.all.as.innerHTML=" "; } else { document.all.as.innerHTML=" "; }
    if(qwer==2 && document.all.bs.innerHTML==" ") { document.all.bs.innerHTML=" "; } else { document.all.bs.innerHTML=" "; }
    if(qwer==3 && document.all.cs.innerHTML==" ") { document.all.cs.innerHTML=" "; } else { document.all.cs.innerHTML=" "; }
    if(qwer==4 && document.all.ds.innerHTML==" ") { document.all.ds.innerHTML=" "; } else { document.all.ds.innerHTML=" "; }
    }
    </script>


    Könnt ihr mir helfen?

  • #2
    In der CSS-Datei (style.css) hat nav4:hover eine graue Farbe.
    Setze einfach im Menue die Links richtig mit der class="nav4", dann werden auch alle grau angezeigt.

    Heisst also:
    um maennliche Jugend muss noch ein <a href class="nav4" ...

    dann klappt es. Die anderen Links im linken Menue werden doch auch grau.


    Edit: Damen, Herren, x- Jugend funktionieren nicht. Reiseteams etc. funktioniert. Die funktionieren aber nur weil die als Links gesetzt sind. Und deswegen kann auch der hover fuer nav4 greifen. Is klar warum dit bei den anderen net funzt.
    Zuletzt geändert von Peter_Panther; 14.01.2007, 21:35.
    Niveau sieht nur von unten aus wie Arroganz!

    Kommentar


    • #3
      ...

      Die sache ist die: der Punkt "männliche Jugend", "herren", etc. haben aber keinen festen link. Sie sind nur das obermenü. Wie kann ich diese also färben lassen?

      Im tabellen feld geb ich die class ja schon an.

      Wie man hier sieht hab ich bereits die class benannt:

      <span id="c" class="[COLOR=red]nav04[/COLOR] " onclick="qwer=3;vor(),merker=3;dara()">
      <span id="cs"></span>Weibliche Jugend</span><br>
      Zuletzt geändert von Neodan; 14.01.2007, 22:53.

      Kommentar


      • #4
        Naja, ohne viel Aufwand koenntest du in das link-tag folgendes schreiben
        <a href="#" ...

        Also Damen und Herren mit diesen tags versehen, dann klappt es.
        Niveau sieht nur von unten aus wie Arroganz!

        Kommentar


        • #5
          Super

          Sehr guter hinweis. Einfach aber effektiv. Danke!

          Kommentar

          Lädt...
          X