2013-10-16 32 views
0

只是遇到了Firefox的問題。我所有的CSS和動畫Safari /鉻中工作,但是當我指定-moz,它不工作在Firefox一些我的工作代碼爲:CSS即使在聲明時也不能在Firefox中工作-moz

@-webkit-keyframes 'blink' 
{ 
    0% { 
     opacity:0; 
    } 
    25% { 
     opacity:1; 
    } 
    75% { 
     opacity:1; 
    } 
    100% { 
     opacity:0; 
    } 
} 

@-moz-keyframes 'blinkmoz' 
{ 
    0% { 
     opacity:0; 
    } 
    25% { 
     opacity:1; 
    } 
    75% { 
     opacity:1; 
    } 
    100% { 
     opacity:0; 
    } 
} 


.fadein 
{ 
-webkit-opacity: 0; 
-moz-opacity: 0; 
opacity: 0; 
-webkit-transition: 1s ease; 
-moz-transition: all 1s ease; 
-ms-transition: all 1s ease; 
-o-transition: all 1s ease; 
transition: all 1s ease; 
-webkit-animation-direction: normal; 
-webkit-animation-duration: 8s; 
-webkit-animation-name: blink; 
-webkit-animation-timing-function: ease-in-out; 
-moz-animation-direction: normal; 
-moz-animation-duration: 8s; 
-moz-animation-name: blinkmoz; 
-moz-animation-timing-function: ease-in-out; 
} 

任何幫助表示讚賞。謝謝

回答

0

don't need在Firefox 23 +的-moz前綴,你可以使用預期的CSS關鍵幀聲明(你目前的CSS中沒有)。這也適用於IE10 +。您也不需要將動畫名稱包含在引號中:

@keyframes blinkmoz 
{ 
    0% { 
     opacity:0; 
    } 
    25% { 
     opacity:1; 
    } 
    75% { 
     opacity:1; 
    } 
    100% { 
     opacity:0; 
    } 
} 

.fadein { 
    animation-name: blinkmoz; 
    animation-duration: 8s; 
    animation-direction: normal; 
    animation-timing-function: ease-in-out; 
} 
+0

謝謝你!加工 – Pierre

相關問題