2017-02-12 3 views
0

私はanimate.cssフレームワークを使用してソーシャルメディアアイコンをアニメーションしていますが、IE10とIE11では別のアニメーションが得られます。その振る舞いを修正するための特定のプレフィックスやその他のトリックがありますか?ここでIE10とIE11で異なるanimate.cssアニメーション

は私のjQueryのコードです:ここでは

$('li.social-item').hover(
    function(){ 
    $(this).toggleClass('animated pulse'); 
}); 

は、対応するCSSクラスです:私は間違って

.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

.pulse { 
    -webkit-animation-name: pulse; 
    animation-name: pulse; 
} 

@keyframes pulse { 
    from { 
    -webkit-transform: scale3d(1, 1, 1); 
    transform: scale3d(1, 1, 1); 
    } 

    50% { 
    -webkit-transform: scale3d(1.05, 1.05, 1.05); 
    transform: scale3d(1.05, 1.05, 1.05); 
    } 

    to { 
    -webkit-transform: scale3d(1, 1, 1); 
    transform: scale3d(1, 1, 1); 
    } 
} 

何をしているのですか?

+0

*私は間違っていますか?* - あなたはフィドルを投稿せずにデバッグの手助けをしたいです – smnbbrv

+0

両方のバージョン、同じアニメーションでコードを試しました:https://jsfiddle.net/nydjhLce/ .... how彼らはあなたが試してみると違うのですか? – LGSon

+0

@smnbbrv .. IEの動作をシミュレートするフィドルを投稿できますか? – Codehan25

答えて

0

問題は%transformsと思います。 IE10とIE11には%変換の問題があります。ですから、/からpxとのブレンドを試してみてください。

+0

いいえ、IEでは 'transform'には一般的な問題はありませんが、この場合はそれを見つけたら、コードとその解決策を表示することをお勧めします。 – LGSon

関連する問題