Version imprimable
Bonsoir à tous,
voici un article expliquant les transformations 3D en CSS3. Vous apprendrez également à faire un cube, un flip card, etc...
Munissez vous d'un navigateur Safari afin de pouvoir profiter des démos.
Comme d'habitude, n'hésitez pas à faire part de vos remarques et questions à la suite de ce message.
:fleche: Les transformations 3D en CSS3
Merci!
tres tres intéressant je ne pensait que safari etait deja capable de faire du css3d en tout cas le faire en css avec possibilité d'interagir avec le javascript sa promet
apparemment selon ce que j'ai lu au niveau de la feuille de route de Firefox sa devrait être mis en place dans le courant de l'année
en tout cas le tuto est claire et precis; et félicitation pour les demos
C'est plutôt une bonne nouvelle concernant Firefox, j'espère que les autres navigateurs feront de même!
Merci pour cet article ! :ccool:
Les exemples à la fin sont assez impressionnants !
C'est super. Ce ne serait plus la peine de passer du temps sur photoshop pour faire vite fait quelques effets.
Mais parfois je me demande si c'est vraiment un gain de temps sachant qu'il faudra gérer les exceptions des autre "gros" navigateurs du marché. Genre IE.
IE ne gère toujours pas les ombrages, les dégradés, de la même façon que chrome ou firefox. Il faut passer par des sortes de patch qui au final laisse des grosses différences d'affichages.
Autre exemple, je crois que seul firefox gère le multi-dégradés, on peut faire 3 dégradés successifs sur firefox mais pas sur chrome. Mais sur chrome on peut gérer l'angle de dégradé radial et pas sur firefox... Bref. Tant que ce n'est pas uniformisé, c'est pas la peine.
sa ma tellement inspirer que j'ai realisé un cahier avoir a cette endroit
Sympa comme exemple :ccool:
Concernant la compatibilité des navigateurs, Chrome 12 (Chrome Canari dans sa version 12 pour l'instant) permet le rendu 3D en CSS3.
Sous windows XP, il faudra ajouter l'argument :
En effet Chrome a enlevé le support WebGL par défaut sous XP (et cela depuis la version 10) :Code:
2
http://www.google.com/support/forum/...3379b1a2&hl=en
Bonjour,
Ce tutoriel est magnifique, vraiment ! Et je remercie ornitho13 pour son tutoriel :ccool:
Le problème, c'est que ce n'est compatible que sur safari qui est l'un des navigateurs les moins utilisés.
Alors voila, n'y aurait il pas une autre solution qui permettrait le même rendu mais sur tout les navigateurs ? Avec que du javascript peut être ?
Merci de vos réponses
fonctionne maitenant avec firefox 10 et une precision au sujet de l'attribut perspective il faut mettre (px) pour que firefox accepte la perspective
Code:
2