Andreas: Problem mit Ausblenden einer Ebene(Aufklappmenue)

Hallo!

Ich habe ja kürzlich ein kleines Aufklappmenue(<div> Ebene eingeblendet) gebastelt. Aber durch folgende Seite bin ich wieder dazu gekommen, das nochmal etwas zu überarbeiten: http://www.phpwizard.net/ dieses dort ist wirklich gut wie ich finde. Es reicht, wenn es im IE > 5 uind NN > 6 funktioniert, also kann ich nur mit getElementById arbeiten.

Ich habe die 2 Probleme:
1. Weiß ich nicht, wie ich die Ebene wieder verschwinden lassen soll! Ich habe eine Link über den mit onMouseOver die Funktion show() ausgeführt wird.
ich mache das indem ich eine 2. Ebene dahinter einblende, und da bei onMouseOver dann hide() ausführe. Das ist aber irgendwie "unsicher", bleibt oft stehen! Wie könnte man das anders machen? Die Ebene mit dem Menu kann ich für onMouseOut nicht verwenden, da das bei jedem Buchstaben im Menue der Fall ist. Jemand ne bessere Idee?

2. Problem: IE und NN Zeigen die Ebene nicht an selber Position an. Ich habe das wie unten probiert etwas manuell zu machen(if(document.all) andere Koordinaten...), ist aber auch nicht genau und sehr unsauber. Kennt hier jemand ne andere Lösung? Ich habe das mit einer

Das Javascript:

function show() {

if(document.getElementById){

document.getElementById("menue").style.visibility = "visible";
  document.getElementById("layer").style.visibility = "visible";

document.getElementById("menue").style.left = -20;
  document.getElementById("layer").style.left = -40;

if(document.all){
  document.getElementById("menue").style.top = 20;
  document.getElementById("layer").style.top = 20;
  document.getElementById("menue").style.left = -20;
  document.getElementById("layer").style.left = -40;
  }
   else {
     document.getElementById("menue").style.top = 5;
  document.getElementById("layer").style.top = 5;
  document.getElementById("menue").style.left = -5;
  document.getElementById("layer").style.left = -15
     }
   }
}

function hide() {

if(document.getElementById){
     document.getElementById("menue").style.visibility = "hidden";
  document.getElementById("layer").style.visibility = "hidden";
  }
}

Grüße
Andreas

  1. hi

    1. Weiß ich nicht, wie ich die Ebene wieder verschwinden lassen soll! Ich habe eine Link über den mit onMouseOver die Funktion show() ausgeführt wird.

    indem du 'visibility:' auf hidden setzt.

    1. Problem: IE und NN Zeigen die Ebene nicht an selber Position an. Ich habe das wie unten probiert etwas manuell zu machen(if(document.all) andere Koordinaten...), ist aber auch nicht genau und sehr unsauber. Kennt hier jemand ne andere Lösung? Ich habe das mit einer

    könnte damit zusamenhängen, dass du unten den Werten für 'top:' und 'left:' nur Zahlen übergibst, diese aber Längen erwarten.

    Grüße aus Bleckede

    kai

      1. Weiß ich nicht, wie ich die Ebene wieder verschwinden lassen soll! Ich habe eine Link über den mit onMouseOver die Funktion show() ausgeführt wird.

      indem du 'visibility:' auf hidden setzt.

      ;-)
      Ja, das ist klar, aber wie soll ich das auslösen? Wenn man mit der Maus vom Menue/der Ebene runtergeht, soll diese ausgeblendet werden. Aber wenn ich ein onMouseOur auf die Ebene, oder auf die Tabelle Lege, funktioniert das nicht, da man ja durch jedes andere Element darüber die Ebene ausblendet, obwohl man es gar nicht will.

      1. Problem: IE und NN Zeigen die Ebene nicht an selber Position an. Ich habe das wie unten probiert etwas manuell zu machen(if(document.all) andere Koordinaten...), ist aber auch nicht genau und sehr unsauber. Kennt hier jemand ne andere Lösung? Ich habe das mit einer

      könnte damit zusamenhängen, dass du unten den Werten für 'top:' und 'left:' nur Zahlen übergibst, diese aber Längen erwarten.

      Ích habe die Ebene in einer Tabellenzelle eingefügt. Nur die Position 0/0 ist für IE direkt unter der Zelle, und für NN6 direkt darüber! Das ist das Problem!

      Und jetzt das nächste Problem, was so gar nicht passieren dürfte, aber da es im NN7 UND IE6 passiert, muß irgendwas nicht stimmen. Und zwar werden die Zellenrahmen am Anfang nicht ausgeblendet, der restliche Ebene(Zelleninhalte) werden erst bei onMouseOver eingeblendet. Was mache ich da fasch?
      Am besten mal mit eigenen Augen angucken:
      http://autoteile.knet-systems.de(Mit der Maus über Produkte gehen)

      Die Stylesheets dazu:

      a.menue { font-family: Verdana, Arial, Helvetica, sans-serif;
                font-size: 10px;
                font-weight: bold;
                color: #FFFFFF;
                text-decoration: none; }
      table.menue { border-collapse: collapse}
      td.menue { border: 1px white solid;
                 background-color: #336699}

      Viele Grüße

      Andreas

      1. hi

        Ja, das ist klar, aber wie soll ich das auslösen? Wenn man mit der Maus vom Menue/der Ebene runtergeht, soll diese ausgeblendet werden. Aber wenn ich ein onMouseOur auf die Ebene, oder auf die Tabelle Lege, funktioniert das nicht, da man ja durch jedes andere Element darüber die Ebene ausblendet, obwohl man es gar nicht will.

        das onmouseout auf das gleiche, wo auch das onmouseover kommt, oder auf einen gemeinsamen "Container" für Den "Link" und die Ebene...

        Ích habe die Ebene in einer Tabellenzelle eingefügt. Nur die Position 0/0 ist für IE direkt unter der Zelle, und für NN6 direkt darüber! Das ist das Problem!

        sollte der MSIE den Unterschied zwischen position:absolute; und position:relative;  nicht kennen? Also bei position:absolute und 0/0 isses wie nix angeben, bei position:absolute; is 0/0 die linke obere Ecke des nächsten übergeordneten Elementes, dass nicht position:static ist (oder <body>). Wobei ein position:relative-Element noch im normalen Dokumentfluss steht!

        Und jetzt das nächste Problem, was so gar nicht passieren dürfte, aber da es im NN7 UND IE6 passiert, muß irgendwas nicht stimmen. Und zwar werden die Zellenrahmen am Anfang nicht ausgeblendet, der restliche Ebene(Zelleninhalte) werden erst bei onMouseOver eingeblendet. Was mache ich da fasch?

        visibility:hidden? Jo, da bleibt der Rand.

        Hier ist es allerdings in Mozilla 1.1 _fast_ perfekt, müsste nur noch ca. 3 Pixel nach oben - Rand seh ich keinen, der da nicht hingehört..

        Grüße aus Bleckede

        Kai

        1. Hi!

          das onmouseout auf das gleiche, wo auch das onmouseover kommt, oder auf einen gemeinsamen "Container" für Den "Link" und die Ebene...

          Was meinst Du mit Container? In die Zelle in der Die Ebene und der Link steht? im <td> funktioniert zwar das onmouseover, aber onmouesout nicht.

          visibility:hidden? Jo, da bleibt der Rand.

          Wie kann das kommen? Die Tabelle steht in einer Ebene die unsichtbar sein sollte! Wie kann das sein? Im Ie auch nur am Anfang, geht dann langsam weg, im NN bleibts. Wahrscheinlich ist das noch ein bug wenns im Mozilla 1.1 geht!? Aber was soll ich denn da machen?

          Grüße
          Andreas

          1. hi

            Was meinst Du mit Container? In die Zelle in der Die Ebene und der Link steht? im <td> funktioniert zwar das onmouseover, aber onmouesout nicht.

            also ich wüsste nicht, wieso ein onmouseout an eienr <td> nicht gehen sollte...

            Wie kann das kommen? Die Tabelle steht in einer Ebene die unsichtbar sein sollte! Wie kann das sein? Im Ie auch nur am Anfang, geht dann langsam weg, im NN bleibts. Wahrscheinlich ist das noch ein bug wenns im Mozilla 1.1 geht!? Aber was soll ich denn da machen?

            achso, Missverständnis - nur der Rand von dem Element, dem man ein visibility:hidden; gibt bleibt da, allerdings auch nicht immer oder irgendwie so *g*

            Grüße aus Bleckede

            Kai