Weiß jemand wie man so ein feature einbaut

[Hannes Weninger]

Hallo,

weiß jemand wie man sowas macht, wenn man mit der Maus drüber fährt, dass dann der durchsichtige Layer raufgeht und das eigentliche Bild ein bisschen runter.
Wäre dankbar für Hinweise bzgl. Frameworks o.ä.
Danke!!!

lg
Hannes

http://www.agentur-loop.com/en/work

[Matthias Apsel]

Om nah hoo pez nyeetz, Hannes Weninger!

weiß jemand wie man sowas macht, wenn man mit der Maus drüber fährt, dass dann der durchsichtige Layer raufgeht und das eigentliche Bild ein bisschen runter.

Falls du so etwas meinst, darfst du gern den Quelltext untersuchen.

PS: Über eine Nutzung meines Dienstes würde ich mich auch freuen ;-)

Matthias

[Matze]

Dass das Bild runtergeht könnte man mit margin-top machen:

  
.bild { ... }  
.bild:hover { margin-top:3px; }  

Und welches durchsichtige Layer meinst du?

MfG,
  Matze

[ichbinich]

Hallo,

Und welches durchsichtige Layer meinst du?

Ich denke mal er meint so etwas wie Lightbox.

vg ichbinich

[henman]

servus Hannes,

http://www.agentur-loop.com/en/work

Du solltest darauf hinweisen, dass der Effekt unter diesem Link zu finden ist.

Jedenfalls kannst du das mit CSS3 lösen.
Die Pseudoklasse :hover wurde schon erwähnt. Nimm als Beispiel drei Boxen. In der ersten sind die beiden anderen enthalten.
+-----------+
|+---+ +---+|
||   | |   ||
||   | |   ||
|+---+ +---+|
+-----------+

Fährt man mit der Maus über die äußere Box, kann man über :hover die inneren Boxen selektieren und neue Eigenschaften vergeben, die nur bei :hover vorhanden sind.
Damit alles schön fließt, nutze Transitions.

henman

[henman]

servus henman,

+-----------+
|+---+ +---+|
||   | |   ||
||   | |   ||
|+---+ +---+|
+-----------+

kann sein, dass es nich wie gewünscht aussieht, das hat mir die Vorschau aber verschwiegen.
Gemeint sind zwei Boxen innerhalb einer großen.

henman

[Matthias Apsel]

Om nah hoo pez nyeetz, henman!

+-----------+
|+---+ +---+|
||   | |   ||
||   | |   ||
|+---+ +---+|
+-----------+

kann sein, dass es nich wie gewünscht aussieht,

Doch, man kann alles gut erkennen. In der Vorschau sieht man es so, wie es alle ohne User-CSS sehen.

Matthias