Ingo Turski: bei "MouseOver" Ebene einblenden

Beitrag lesen

Hi,

Hintergrundbilder können ja nicht skaliert werden,

korrekt. Daher muß der Container passend dimensioniert werden. Und dies erledigt das enthaltene img browserübergreifend. Durch visibility:hidden wird es lediglich unichtbar, nimmt aber weiterhin denselben Raum in Anspruch.

Nur wo wird die Höhe der hover-prof-Bilder auf die 285 px gesetzt?

wie konntest Du nur » img { border:0; height: 285px; } « übersehen?

erst die blassen Bilder bekommen im img-Element die Höhe 285 px zugewiesen.

achso, doch nicht übersehen, nur noch nicht verstanden. ;-)

Wie ich schon sagte, bestimmt das img die Höhe von a und damit auch die Dimensionen des angezeigten Hintergrundbildes. Ausnahme ist » #foto a:hover { width:532px; } « - hier wird dem nur für moderne Browser (der IE würde dabei Probleme machen) display:block formatiertem a-Element eine Breite zugewiesen, weil das Hintergrundbild ja breiter als das img ist.
Diese Lösung ist übrigens auch deshalb wichtig, damit der Container erst bei a:hover die anderen überdeckt.

Im übrigen glaube ich, dass für "xhtml1-strict" einige schließende Etikette fehlen; aber das ist meine ganz persönliche Meinung ...

Ohje, Asche über mein Haupt. Danke für den Hinweis, ist gefixed. Ich hatte das mal so eben in Phase5 zusammengebastelt und nicht nachbearbeitet.

freundliche Grüße
Ingo

0 48

bei "MouseOver" Ebene einblenden

silke
  • html
  1. 0
    Marc Reichelt
    • javascript
    1. 0
      Joachim
      1. 0
        Marc Reichelt
    2. 0
      silke
      1. 0
        Marc Reichelt
        1. 0
          Gernot Back
          1. 0
            Marc Reichelt
            1. 0
              Gernot Back
              1. 0
                silke
          2. 0
            silke
            1. 0
              Gernot Back
              1. 0
                silke
                1. 0

                  TOFU

                  Ashura
                  • zur info
                2. 0
                  Gernot Back
                  1. 0
                    Gernot Back
                    1. 0
                      silke
                      1. 0
                        Gernot Back
                        1. 0
                          silke
                          1. 0
                            Gernot Back
                            1. 0
                              silke
  2. 0
    XaraX
    1. 0
      silke
      1. 1
        Ingo Turski
        1. 0
          Gernot Back
          • css
          1. 0
            Ingo Turski
            1. 0

              & CSS: Nicht Entweder-Oder, sondern Sowohl-Als-Auch !

              Gernot Back
              • javascript
              1. 0
                Ingo Turski
                1. 0
                  Gernot Back
                  1. 0
                    Ingo Turski
                    1. 0

                      whatever:hover

                      Ashura
                      1. 0
                        Ingo Turski
                        1. 0
                          Ashura
                          1. 0
                            Ingo Turski
                            1. 0
                              Ashura
                    2. 0
                      Gernot Back
                      1. 0
                        Ingo Turski
                      2. 0
                        Ingo Turski
                        1. 0
                          Gernot Back
                          1. 0
                            Ingo Turski
                            1. 0
                              Gernot Back
                              1. 0
                                Ingo Turski
        2. 0
          Dada
          1. 0
            Ingo Turski
            1. 0
              Dada
              1. 0
                Ingo Turski
                1. 0
                  Dada
  3. 0
    Gernot Back