CSS3 rotate3D跨浏览器问题

所以我有这个小提琴：http://jsfiddle.net/aA9Rm/1/。它在Firefox中工作得很好，但我在Chrome中遇到了一些问题，我不明白为什么。在Firefox中，如果我将鼠标悬停在workhover容器中后它可以正常工作，则不会执行任何操作，但如果我尝试点击或移动一英寸，则会出现chrome，它会开始移动（摇动），而我不想那。CSS3 rotate3D跨浏览器问题

我用3D旋转，从CSS3，

-moz-transform: rotateY(-90deg);; 
-webkit-transform:rotateY(-90deg); 
transform:rotateY(-90deg);

解决方案的人？

来源

2013-08-28 Stefan Perju

你的Chrome的任何机会：// GPU说3D CSS不可用？ – Passerby

3D CSS：硬件加速 –

它的工作原理，但它不是很好，如果我在第二张脸上移动鼠标，旋转后，它移动一点，不像在Firefox中固定。 –

我觉得你这个问题遇到同样的错误： CSS Flip Transition Between Two <div>'s

它看起来像一个Chrome有错误，其中的div你想旋转旋转有点过分。我可以改变这个CSS（见WebKit的程度）解决您在Chrome的jsfiddle：

.cube:hover{ 
    -moz-transform: rotateY(-90deg); 
    -webkit-transform:rotateY(-89.9deg); 
    transform:rotateY(-90deg); 
}

这是相当哈克，但我从来没有发现任何清晰的解决方案。您也可以用某种方式使用pointer-events: none;属性来使其工作。

来源

2013-08-28 12:33:12

它与旋转89.9deg一起使用。真棒。谢谢。 –

CSS3 rotate3D跨浏览器问题

回答

相关问题