0

私はこの問題について混乱しています。アイコンフォントの色をアニメーション化したいのですが、最新のすべてのブラウザーでは正常に機能しますが、IE 8 では機能しません!

リンクがあります：

<a id="newsletter_subbut"><i class="icon-web-mail"></i></a>

これは私のCSSコードです:

#newsletter_subbut {
    border: none;
    height: 30px;
    width:40px;
    margin-left: -8px;
    font-size:22px;
    position:absolute;
    display:inline-block;
    padding-top:9px;
    bottom:0px;
    z-index: 1;
}
.icon-web-mail:before {
    font-family: 'batch';
    speak: none;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    content: "\F14C";
}

これは私のjQueryコードです：

$('#newsletter_subbut').find("i").stop().animate({color: "#fa2a18"},'slow');
4

2 に答える 2

0

使用している jquery のバージョンがわかりません。とにかく、アニメーションカラーは 1.9.1 では動作しません。以前のバージョンでは動作する可能性があります。IE8 が animate プロパティを理解しないことがあります。あなたはこのように試すことができます -

$('#newsletter_subbut').find("i").stop().animate({color: "#fa2a18"}, 1000, function(){ $('#newsletter_subbut').find("i").animate({ color: "#fa2a18" }); });

また

$('#newsletter_subbut').find("i").animate({ color: "#000" }); // your original color
$('#newsletter_subbut').find("i").animate({ color: "#fa2a18" });

私はこれがクレイジーであることを知っています。しかし、それは私にとってはうまくいきます。

jquery 1.9.x を使用している場合は、このフィドルを試してください - http://jsfiddle.net/HETuE/ - ie8 でも動作します

于 2013-05-27T09:28:00.660 に答える