Problem mit drei div-layern übereinander und mouseover

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

  • Problem mit drei div-layern übereinander und mouseover

    Hallo,

    ich bin dabei ein Menue mit css zu basteln, bei dem drei div-layer übereinander liegen. Im untersten Layer steht ein Text. Darüber liegt ein Bild. Und darüber ein Linkname.
    Wenn nun mit der Maus über diese layer gefahren wird. Soll das Bild transparent werden und der Text in den Vordergrund kommen.

    Hier ein Beispiel

    Das funktioniert auch alles wunderbar, allerdings nur im IE. Schön wäre es wenn es zumindest auch im Firefox laufen würde.
    Hat jemand eine Idee warum es dort nicht funktioniert?

    Viele Grüße,

    Michael

  • #2
    Mmm was passiert wenn Du den Links ein Ziel gibst? (z.B. #)

    Kommentar


    • #3
      nein, das ändert leider auch nichts...

      Kommentar


      • #4
        du weisst, das die benutzung von "filter" ie only ist?

        gruß
        peter
        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
        Meine Seite

        Kommentar


        • #5
          Mmm, er hat ja auch opacity und -moz-opacity drin, daran kanns eigentlich nicht liegen....

          Kommentar


          • #6
            stimmt, übersehen. es liegt daran, dass der folgende bereich komplett über den bildern liegt:
            PHP-Code:
            <!-- Linkbeschreibungen zu den Bildern -->
            <
            div style="position: absolute; top: 100px; left: 350px; width: 460px; border: 1px solid #f00;">
            <
            div id="link">...
            </
            div
            habe eine border zur veranschaulichung gesetzt. da kann das mit dem hovern nicht funktionieren. wenn der bereich weg ist, funktioniert es auch im ff.

            gruß
            peter
            Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
            Meine Seite

            Kommentar


            • #7
              Danke für Eure Antworten,

              aber kann man das denn nicht irgendwie hinbekommen? Auch mit drei divs übereinander? Die Linkbeschriebung sollte nämlich schon drin bleiben. Im IE funktioniert es ja mit dem hovern trotz dem die Linkbeschreibung über allem liegt. Kann man da nichts für den ff tricksen?

              Viele Grüße,

              Michael

              Kommentar


              • #8
                z-index?

                Kommentar


                • #9
                  nutze ich ja schon, aber das funktioniert im ff irgendwie nicht...

                  Kommentar


                  • #10
                    pach den linktext und das bild in ein element.

                    gruß
                    peter
                    Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                    Meine Seite

                    Kommentar


                    • #11
                      Das war schon mal eine sehr gute Idee! Im Ansatz geht es jetzt schon mal...
                      Vielen Dank!
                      Nun ist sind allerdings die Linknamen nicht mehr im Vordergrund und um eine Zeile nach unten verschoben. Ich bekomme es irgendwie nicht hin das die dort liegen wo sie hinsollen. Habt Ihr hierzu vielleicht auch noch eine Idee?

                      Viele Grüße,

                      Michael

                      Kommentar


                      • #12
                        nicht mit div-suppe arbeiten, sondern z.b. mit <p> und das entsprechend formatieren.

                        gruß
                        peter
                        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                        Meine Seite

                        Kommentar


                        • #13
                          Hmm, ich habe jetzt mit span und p gearbeitet. Aber wie formatiere ich es so, dass die Linkbeschriebung im Vordergrund ist und richtig ausgerichtet?

                          Link

                          Kommentar


                          • #14
                            Ich bin jetzt noch mal ein wenig weiter gekommen. Die Linkbeschreibung liegt nun über dem Bild, aber leider immer noch um eine Zeile nach untern verschoben.

                            siehe hier

                            Sieht jemand woran das liegt? Ich kann es mir nicht erklären...

                            Kommentar


                            • #15
                              <span id="bild">...<p id="link_name">...</p></span>
                              du darfst ein block-element (p) nicht in ein inline-element packen. des weiteren darf eine id pro seite nur einmal(!) vorkommen.setz mal <p class="bild"> und <span class="link_name"> und spiel ein wenig herum.

                              gruß
                              peter
                              Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
                              Meine Seite

                              Kommentar

                              Lädt...
                              X