Blog iamvdo.meLe tutoriel complet est à retrouver sur html5-css3.fr.
Vous pouvez également lire un billet de blog pour rendre compatible l’effet Flipcard sous IE10 que j’ai écris sur mon blog perso.
Flip-card avec les transformations 3D CSS
Réaliser un effet de retournement 3D avec CSS3
Création: décembre 2011Modifié:
What a beautiful graphic!
Tutoriel et explications sur la réalisation de cet effet de retournement type "flip-card" avec les transformations 3D en CSS : à retrouver sur http://www.html5-css3.fr/css3/transformations-3d-css3.
#1par Nico, le 2 décembre 2011
Bel effet mais ça ne fonctionne pas sur Firefox 8.0.1..
#2par css3create, le 2 décembre 2011
@Nico : oui, ça fonctionne avec Firefox 10 car j’utilise les transformations 3D.
#3par vive firefox10, le 14 janvier 2012
L’effet est remarquable manque plus que tout les utilisateurs utilisent un naviguateur adapté a l’évolution du web...
#4par Seb, le 17 janvier 2012
Pareil, ne marche pas sous la plupart des versions de firefox (actuelles)... Ce serait cool que tout le monde se mette au html5/css3 :)
#5par michel.pageperso, le 11 février 2012
Vous utilisez ces propriétés CSS3 dans 2 div différentes. J’ai essayé de les utiliser dans un menu/sous-menu classique en liste ordonnée #menu ul li ol li.... Cela ne fonctionne pas avec Chrome mais pas avec Opéra ou Firefox. Pourquoi ?
#6par SeanGooGoo, le 21 février 2012
Sans Jquery ne fonctionne que sous très peu de navigateurs. Bravo en tout cas !
#7par dark poulpo, le 10 juillet 2012
super, dommage que ça ne marche pas avec IE 9.0.8 !!! suis dég !!
#8par Alec, le 10 août 2012
Chez moi ça fonctionne nickel, sauf que je n’arrive qu’à mettre du texte brut à l’intérieur. Dès que je mets le plus petit lien, ça plante —’ ... Je pense que c’est du au "first-child" dans le code CSS, mais je vois pas trop comment régler le problème ...
Enfin c’est quand même un super truc qui a la classe ^^ !
#9par solo, le 31 janvier 2013
in IE 10 it is incorrect !
#10par Alice-Dark, le 15 octobre 2013
Super tuto ! C’est nickel et c’est très pratique. Pas besoin de JS pour une fois ! Merci ! ^^