0

所以我有这个小提琴：http: //jsfiddle.net/aA9Rm/1/。它在 Firefox 中工作得很好，但我在 chrome 中遇到了一些问题，我不明白为什么。在firefox中，如果我在悬停容器中悬停后移动鼠标，它可以正常工作，不执行任何操作，但是在chrome中，如果我尝试单击或移动一英寸，它会开始移动（摇晃）并且我不想要那。

我使用来自 CSS3 的 3D 旋转，

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

解决方案有人吗？

4

1 回答 1

2

我认为您在这个问题中遇到了同样的错误： 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);
}

这很hacky，但我从未找到任何干净的解决方案。您还可以pointer-events: none;以某种方式使用属性来使其工作。

于 2013-08-28T12:33:12.523 回答