9
votes

CSS 3D transforme fonctionne au hasard au chrome 16

J'ai un problème vraiment étrange où CSS 3D transforme parfois et parfois pas. Avant de passer à la dernière version de Chrome, il a toujours fonctionné mais avec la version 16 ne fonctionne que au hasard.

Plus spécifiquement, il semble que la perspective -webkit ne prend pas ce qui rend tout à plat (bien que les éléments soient toujours transformés). Changer la perspective dans "Firebug" de Chrome après que la page a été chargée n'affecte rien non plus.

La page en question est ici: http://excale.se/__files/uploads/jQuery- 3D-Circle.htm . Je sais qu'il y a beaucoup de code, mais les choses liées aux transformations 3D sont toutes dans ce fichier CSS: http://code.google.com/p/sleekphp/source/browse/trunk/sites/sleekbase/modules/base/css/jquery.Chreedcircle.SCSS

Ma question est la suivante: faites-vous le même problème avec ma page ou avez-vous déjà vécu cela vous-même? Et si oui, pouvez-vous penser à tout ce qui le déclenche?

Je devrais mentionner que j'utilise Ubuntu 10.10 et Chrome 16.0.912.63.


5 commentaires

Je ne vois aucun problème dans Chrome 16.09 ou Safari sur le Mac. Peut-être que c'est un problème de chrome Linux?


Je rencontre le même problème dans Windows sous Virtualbox. C'est tellement étrange que ce soit aléatoire cependant.


Même chrome mais sur Win7 x64: Aucun problème. - À une autre affaire: N'oubliez pas que ces animations un peu elles soient bonnes sur des machines rapides. J'ai dû passer à la meilleure performance sur mon Lenovo X200 pour voir une animation fluide ...


Salut. Je connais actuellement le même problème sur une bêta de Linux Chrome 16.0.912.63. Avez-vous compris ce que le problème était?


Je n'ai pas été capable de comprendre ce qui le causse. La chose la plus étrange est que cela fonctionne parfois sans rien changer dans le code.


3 Réponses :


16
votes

Chrome a surveillé votre GPU et refuse de faire n'importe quel CSS 3D.

La solution est assez simple: activez la "liste de rendu du logiciel de substitution" dans "chrome: // drapeaux".

voir https://github.com/bartaz/impress.js/issues/40 << / p>


1 commentaires

Doux! Ça l'a fait. Si étrange quand il ne fonctionne que au hasard (ou peut-être que ce n'était pas aussi aléatoire que je pensais pour la première fois).



1
votes

Aller à la interface SCM de chrome Web et vérifiez que votre GPU n'est pas sur la liste noire.

Aussi, allez à chrome: // GPU / et vérifiez que Chrome rapporte 3D CSS comme activé.


0 commentaires

1
votes

Voici quelque chose que j'ai trouvé cela peut être le problème. Lorsque vous utilisez le code

-webkit-transform: perspective(600px) rotateY(45deg);


2 commentaires

Je suppose que vous n'avez pas lu l'ensemble du fil parce que si vous le faites, vous remarqueriez que Markus a trouvé la solution il y a environ 6 mois.


Eh bien, cela m'a aidé à résoudre un problème FF avec un cardflip 3D ne fonctionne pas. Utilisation --Moz-Transform: Perspective (600px) Rotationy (45DEG);