2013-08-25 70 views
1

我有這樣的小提琴http://jsfiddle.net/Dgy2Q/3/WebKit的動畫作品在Chrome,但在Firefox中沒有

#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%; 
    } 
} 

,在鍍鉻的偉大工程。它不工作在Firefox中,我看不到我做錯了什麼?任何人都可以看到我做錯了什麼?

謝謝

已修改小提琴但仍然沒有喜悅?還要別的嗎?

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

回答

1

你必須在perspective功能錯誤。它的參數應該是一個單位的長度。將300更改爲300px,它將在Firefox中運行。

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

結果是不相同的,但。不知道是什麼原因造成的,是否可以用CSS來糾正,或者它只是瀏覽器中的不同實現。

+0

現在感謝偉大工程! – user2247671

相關問題