animate.cssがfirefoxとchromeで2倍の時間をロードしています

Question

こんにちは、私のページで私を助けてください私はanimate.cssファイルからfadeInUp CSSを使用しました。私がfirefoxで開くと、それは倍の時間をロードしています。

これは私が使用したCSSです。

@-webkit-keyframes fadeInUp { 
    from { 
    opacity: 0; 
    -webkit-transform: translate3d(0, 100%, 0); 
    transform: translate3d(0, 100%, 0); 
    } 

    to { 
    opacity: 1; 
    -webkit-transform: none; 
    transform: none; 
    } 
} 

@-moz-keyframes fadeInUp { 
    from { 
    opacity: 0; 

    -moz-transform: translate3d(0, 100%, 0); 
    transform: translate3d(0, 100%, 0); 
    } 

    to { 
    opacity: 1; 
    -moz-transform: none; 
    transform: none; 
    } 
} 

@keyframes fadeInUp { 
    from { 
    opacity: 0; 
    -webkit-transform: translate3d(0, 100%, 0); 
    -moz-transform: translate3d(0, 100%, 0); 
    -ms-transform: translate3d(0, 100%, 0); 
    -o-transform: translate3d(0, 100%, 0); 
    transform: translate3d(0, 100%, 0); 
    } 

    to { 
    opacity: 1; 
    -webkit-transform: none; 
    -moz-transform: none; 
    -ms-transform: none; 
    -o-transform: none; 
    transform: none; 
    } 
} 

.fadeInUp { 
    -webkit-animation-name: fadeInUp; 
    -moz-animation-name: fadeInUp; 
    -ms-animation-name: fadeInUp; 
    -o-animation-name: fadeInUp; 
    animation-name: fadeInUp; 
} 

あなたは2回、それを設定しているにも私はクロームで同じエラーを取得していますいくつかの回

Answer 1

。

限りfadeInUpは、すべてのブラウザがサポートしている@keyframesのコードとして、あなたは必要はありません。 @ -moz-キーフレームfadeInUp {...}と@ -webkit-キーフレームfadeInUp {...}