Bild vorher/nachher-Effekt per CSS ?

[alexanderhey]

Guten Morgen.

Ich möchte gerne diesen Effekt hier per HTML/CSS umsetzten-also wenn man mit der Maus über das Bild geht.:


Ansonsten finde ich das hier auch schick:


Geht das auch per CSS oder muss ich dafür zwingen swf nehmen. Ich suche mir schon nen Wolf in diversen Suchmaschinen, finde aber alles andere nur nicht sowas. Hoffe ihr könnt mir ein paar Links geben.

EDIT: Wichtig ist für mich, daß ich ne Zeit eingeben kann wie lange die jeweilige Aktion dauern soll.

Danke und Gruß Alex

 

[nippo88]

AW: Bild vorher/nachher-Effekt per CSS ?

Das was du suchst ist wohl mit jQuery möglich damit kann man gut den Inhalt auf webseiten Manipulieren. Hier wären mal ein paar Effekte, die im Ansatz dem schon sehr nahe kommen was du suchst:

 

[DaTrautinger]

AW: Bild vorher/nachher-Effekt per CSS ?

Servus Alex, "Was es nicht Alles gibt!" - Ich habe mit den Zeugs zwar Nichts am Hut (noch nicht!) aber es sind doch schon beeindruckende Teile. Schön, dass Du uns das vorgestellt hast! Danke dafür und Gruß. DaTrautinger

 

[alexanderhey]

AW: Bild vorher/nachher-Effekt per CSS ?

Hallo.

Na beim dem Effekt von deviant kann man einfach mit nem onmouseover oder so arbeiten. Ich möchte aber den Effekt mit einer Zeitkomponente. Ansonsten sieht das (meiner Meinung nach) nicht so schön aus. Bitte bitte für's "zeigen" von solchen Dingen

Gruß Alex

 

[Davi2000]

AW: Bild vorher/nachher-Effekt per CSS ?

Also der Effekt ist mit CSS3 und Transition überhaupt kein Problem.

 

[skunkone]

AW: Bild vorher/nachher-Effekt per CSS ?

Das mit den Transition ist schon nicht schlecht, wobei ich den Slider auch sehr beeindruckend finde.

 

[Davi2000]

AW: Bild vorher/nachher-Effekt per CSS ?

Das mit den Transition ist schon nicht schlecht, wobei ich den Slider auch sehr beeindruckend finde.

Hat alles seine Vor und Nachteile, wobei man wohl leider mit JavaScript ne bessere Browserunterstützung hat als mit CSS3.

 

[alexanderhey]

AW: Bild vorher/nachher-Effekt per CSS ?

Hallo.

Vielen Dank an alle. Ich habe mich am Ende für das hier entschieden. Eventuell könnte ihr ja auch was davon gebrauchen, daher möchte ich euch das nicht vorenthalten.



Gruß Alex

 

[Br0]

AW: Bild vorher/nachher-Effekt per CSS ?

Falls es dich dennoch interessiert den Slider Effekt hatte ich vor einiger Zeit schonmal in verwendung:

http://www.catchmyfame.com/2009/06/25/jquery-beforeafter-plugin/

 

[cocodina]

AW: Bild vorher/nachher-Effekt per CSS ?

Davi2000 und Br0 und alexander - Danke für diese tollen Links, den Transition-Effekt habe ich noch nicht angewendet, jQuery schon, aber davon gibts ja immer wieder neue Sachen - TOLL, möchte man direkt ausprobieren...

 

[alexanderhey]

AW: Bild vorher/nachher-Effekt per CSS ?

Hallo Br0

Auch an dich nochmal vielen Dank. Jetzt habe ich beide Effekte

Gruß Alex