Suche JavaScript Animation | Beim Klicken auf Bild geht eine Art "Tor auf"

[Tribo0n]

Hallo Community,
ich suche eine JavaScript Animation. Beim Klicken auf ein Bild soll ein Effekt kommen der eine Tür/Tor öffnet. Gibt es da was fertiges freies/kostenloses welches man nutzen kann?

Vielen Dank für die Hilfe.

 

[Freezedevil]

Das sollte mit einer Mischung aus JS und CSS-Transform eigentlich recht leicht umsetzen lassen.

 

[Daaron]

...nur dass CSS Transforms nicht einmal ansatzweise flächendeckend funktionieren.

 

[Freezedevil]

Ja stimmt, ich hab es bisher immer nur für den "Heimgebrauch" benutzt und da hat es mir gereicht wenn es mit Webkit funktioniert. Aus diesem Grund hab ich ganz vergessen, dass die mangelnde Unterstützung sicher für den ein oder anderen problematisch ist.

 

[Tribo0n]

Schade, also gibt es kein fertiges Script welches das kann? Ich bin sicher mal so etwas im Netz gesehen zu haben, weiß leider nur nicht mehr wo...

 

[Daaron]

Für so ein Tor bräuchtest du perspektivische Änderungen, wie sie nur mit 3D-Transformationen möglich sind. Das kann nicht einmal das reguläre HTML5 Canvas-Element (das ist üblicherweise nur 2D implementiert). Und selbst wenn Canvas das könnte: Knackpunkt Browsersupport.

Was du da gesehen hast war entweder Handarbeit, Frame für Frame, oder es war Flash.

 

[Freezedevil]

Man kann das eigentlich mit jedem Element machen. http://www.w3schools.com/cssref/css3_pr_perspective.asp
Geht aber momentan nur in Webkit-Browsern und deshalb bleibt dir nur die Möglichkeit mal zu gucken ob man mit jQuery hier irgendwas anfangen kann. Damit kenne ich mich aber leider nicht aus.

 

[Daaron]

Klar geht sowas über JavaScript.... wenn man auf das <canvas>-Element zugreifen kann. Damit schließt du aber wieder einen sehr großen Marktanteil aus....
Und bevor ich mich mit JS+Canvas rumärgere nehm ich gleich CSS3 Transitions&Transforms.... oder Flash.