1

我有这个小提琴http://jsfiddle.net/Dgy2Q/3/ 

#LeftDoor{
position: absolute;
height: 100%;
width:50%;
z-index: 30;
background-color: blue; 
left:0px;
 -webkit-animation: leftDoorOpen 1s ease 1s; 
 -webkit-animation-fill-mode: forwards;
-moz-animation: leftDoorOpen 4s ease 4s; 
-moz-animation-fill-mode: forwards;
}
@-webkit-keyframes leftDoorOpen {
    from {
       -webkit-transform: perspective(300) rotateY(0deg);
       -webkit-transform-origin: 0% 0%;
    }
    to {
       -webkit-transform: perspective(300) rotateY(90deg);
       -webkit-transform-origin: 0% 0%;
    }
}
@-moz-keyframes leftDoorOpen {
   from {
   -moz-transform: perspective(300) rotateY(0deg);
   -moz-transform-origin: 0% 0%;
}
to {
   -moz-transform: perspective(300) rotateY(90deg);
   -moz-transform-origin: 0% 0%;
    }
 }

在 chrome 中效果很好。它在Firefox中不起作用，我看不到我做错了什么？？？谁能看到我做错了什么？

谢谢

已经修改了小提琴但仍然没有快乐？还要别的吗？

http://jsfiddle.net/Dgy2Q/10/

4

1 回答 1

1

您在perspective函数中有错误。它的参数应该是一个长度，有一个单位。更改300为300px，它将在 Firefox 中运行。

http://jsfiddle.net/MrLister/Dgy2Q/6/

结果并不相同。不知道是什么原因造成的，如果它可以用 CSS 纠正，或者它只是浏览器中的不同实现。

于 2013-08-25T07:17:44.873 回答