GIF動(dòng)畫圖片在IE中不能正常顯示的解決方法

IE和FirFox在很多地方都有著或多或少的不同，這導(dǎo)致在開(kāi)發(fā)時(shí)需要考慮很多的特殊情況。在最近的項(xiàng)目中居然發(fā)現(xiàn)帶動(dòng)畫的GIF圖片在頁(yè)面Load之后再以腳本控制的方式展現(xiàn)時(shí)，動(dòng)畫不能表現(xiàn)出來(lái)。在我的項(xiàng)目中，需要在點(diǎn)擊一個(gè)按鈕后來(lái)顯示一個(gè)動(dòng)態(tài)的Loading圖片以此表示程序正在進(jìn)行后臺(tái)處理。這是通過(guò)一段jQuery代碼來(lái)實(shí)現(xiàn)的：

function showMessage() {
......
$("div#Processing").show();
......
}

<div id="Processing" style="display: none">
<center>
<img src="placeOrder_processing.gif" />
</center>
</div>

IE顯示了圖片，但是動(dòng)畫卻不能播放。而在FirFox中卻能正常的工作。當(dāng)你將整個(gè)DIV加入到DOM中時(shí)，這個(gè)DIV是隱藏的，不可見(jiàn)的。但是當(dāng)你將其屬性設(shè)置為可見(jiàn)時(shí)，動(dòng)畫卻不能被正常播放。如果將帶動(dòng)畫的GIF圖片直接以可見(jiàn)的形式加入到DOM中，它是可以正確的現(xiàn)實(shí)并播放動(dòng)畫的。那么，可以這樣更改代碼：

<script language="javascript" type="text/javascript">
function showMessage() {

$("div#Processing").show();
var imgSrc = '<%=ResolveUrl("~/Images/Checkout/placeOrder_processing.gif") %>';
$("td#imgSection").append("<img src='" + imgSrc + "'/>");

}

</script>

這樣，在可見(jiàn)的內(nèi)容中將Img加入到DOM中就可以解決這個(gè)問(wèn)題了。

出處：http://www.cnblogs.com/zlgcool/

生活不易，碼農(nóng)辛苦
如果您覺(jué)得本網(wǎng)站對(duì)您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈(zèng)