Transformations 2D et 3D en CSS
Par Laurentj le vendredi, juillet 17 2009, 13:46 - Technologies Web - Lien permanent
Ainsi donc, webkit supporte maintenant les transformations 3D en CSS. Je trouve ça génial. J'apprécie déjà les transformations 2D (que j'utilise sur la page d'accueil de jelix.org). Mais là, ça ouvre encore plus de perspectives (c'est le cas de le dire ;-)).
Seulement, à travers les demos que j'ai ouvert dans mon Firefox (qui ne supporte pas les propriétés transform3D), j'ai remarqué que l'utilisation de ces transformations avaient un écueil : ça se dégrade très mal dans les navigateurs ne supportant pas ces propriétés. Du genre, les éléments s'affichent les uns sur les autres. Il y a certainement des améliorations possibles dans ces démos pour que ça se dégrade un peu mieux. Mais c'est certain qu'il va falloir faire attention...
Pour les plus curieux d'entre vous, les brouillons des spécifications sont disponibles sur le site du W3C : CSS3 3D transforms, CSS3 3D transforms.
Commentaires
"ça ouvre encore plus de perspectives"
A quand ton passage aux grosses têtes ? ;)
Il y a de plus en plus de projet en rapport avec la 3d sur le web.
Les plugins et active X spécialisé existe depuis longtemps.
Flash si est mis notamment avec les librairies 3d (Papervision, Sandy, ect ...)
http://www.flashsandy.org/blog/a-sa...
Resemant c'est le java-script qui si met également
avec un projet intéressant : sandy hx Qui est un portage de la librairie Sandy en haXe
http://webdemos.sourceforge.net/hax... (google chrome)
Et avec le projet de Google O3D
http://o3d.googlecode.com/svn/trunk...
Et maintenant c'est les spécifications W3C qui sont implémentés.
C'est une belle progression, mais ce qui est marrant c'est que malgré tout ça, la 3d n'est pas encore très courante sur le web.
J'imagine que quand les navigateurs seront près on en verra de plus en plus.
Maintenant, les plugins (flash ou autres) gère la physique des objets, c'est surement l'avenir des spécifications du w3c
Coucou c'est moi. Y avait écrit WebKit alors je suis rentré ;)
Effectivement, les démos sont des petits hacks et pas pensée du tout pour les autres navigateurs. C'est pas bien du tout mais, il y a les media queries pour résoudre ça : http://webkit.org/specs/MediaQuerie... . Ce sera pas automatique, mais on a moyen de détecter niveau CSS la présence ou non de cette fonctionnalité et adapter le code.
Sinon, en parlant de démo qui dégrade mal, ne me lance pas sur celles présentes sur hacks.mozilla.org :)
@peter : quand j'aurais été découvert par philippe bouvard :-)
@rik : oui, je sais bien que les demos sont pas fait pour. Je voulais juste faire remarquer de faire attention à la degradation dans les autres browsers. Et oui, il y a sûrement des demos sur hacks.mozilla.org qui passent trop mal sur autre chose que Firefox. Cependant, tu remarqueras que dans beaucoup de demos CSS, ils mettent aussi les propriétés -webkit-* ;-)