Image flip backface text

[TecEye]

Hy also ich arbeite an einer Bilder-Kachel-Galerie wo man sich die effekte zusammenklicken kann um dann ein entsprechendes Ergebnis zu erhalten, daher der modulare css aufbau.

Die HTML Struktur ist immer gleich und es werden dann die entsprechenden CSS befehle kombiniert.

alle funktionieren wunderbar, außer wenn ich das bild flippe und ein fading mache, dann flackert das einmal so kurz auf am ende, also das Bild zuckt so.

Hab mal die entsprechenden auszüge zusammengefasst und euch in JSFIDDLE gemacht zur Anschauung, hoffe jemand hat ne idee was es ist

http://jsfiddle.net/3rnuuvjr/1/

Ach ja der Fehler tritt nur im Chrome auf

- - - Aktualisiert - - -

und wäre jemand in der lage mir mal zu erklären wie ich diesen Flippeffekt in 3D mache? hab zwar viele Seiten dazu gefunden, aber wenn ich es einbaue bleibt es trotzdem 2D

 

[kkapsner]

Ich kann dein Problem im Chrome nicht reproduzieren.

und wäre jemand in der lage mir mal zu erklären wie ich diesen Flippeffekt in 3D mache? hab zwar viele Seiten dazu gefunden, aber wenn ich es einbaue bleibt es trotzdem 2D

Was hast du denn probiert?

 

[TecEye]

Ja da muss irgendwie (-webkit-perspective und -webkit-transform-style: preserve-3d) rein aber egal wo und wie ich es mache, es ändert sich nix, es wird nicht 3D, weißte so karte flippen, eine seite wird perspektivisch größer, andere seite kleiner, bis es sich vollständig gedreht hat

- - - Aktualisiert - - -

Guckmal wenn ich ne Animation reinmache dann geht das, aber diesen 3D Effekt will ich beim Hovern
http://jsfiddle.net/3rnuuvjr/2/

 

[kkapsner]

Das perspective muss an die .imgkachel_1 und außerdem braucht es eine Einheit.

 

[TecEye]

Yeahr klasse Edit fiddle - JSFiddle danke

 

[mikdoe]

Sieht cool aus!

 

[kkapsner]

danke

Bitte - gern geschehen.