手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜Qcloud , 注册 | 登陆

带动画的GIF图片在IE中不能正常工作

首页 > Javascript >

这个问题,怎么说呢,先把症状重复一遍吧:IE显示了图片,但是动画却不能播放。而在FirFox中却能正常的工作。
一直以来,我都以为是浏览器的关系。没有设定好而导致这种情况发生,比如一些在IE核心上开发的浏览器(maxthon)等,都可以把GIF动画关闭的。所以我也就没有仔细研究过。

来看看这个:
IE和FirFox在很多地方都有着或多或少的不同,这导致在开发时需要考虑很多的特殊情况。在最近的项目中居然发现带动画的GIF图片在页面Load之 后再以脚本控制的方式展现时,动画不能表现出来。在我的项目中,需要在点击一个按钮后来显示一个动态的Loading图片以此表示程序正在进行后台处理。 这是通过一段jQuery代码来实现的:

XML/HTML代码
  1. <font size="3" face="Calibri"><script language="javascript" type="text/javascript">function showMessage() {  
  2.         ......  
  3.         $("div#Processing").show();  
  4.         ......  
  5.     }</script>  
  6. <div id="Processing" style="display: none">  
  7.     <center>  
  8.         <img src="placeOrder_processing.gif" />  
  9.     </center>  
  10. </div></font>  

E显示了图片,但是动画却不能播放。而在FirFox中却能正常的工作。当你将整个DIV加入到DOM中时,这个DIV是隐藏的,不可见的。但是当你将其 属性设置为可见时,动画却不能被正常播放。如果将带动画的GIF图片直接以可见的形式加入到DOM中,它是可以正确的现实并播放动画的。那么,可以这样更 改代码:

XML/HTML代码
  1. <font size="3" face="Calibri"><script language="javascript" type="text/javascript">  
  2.     function showMessage() {  
  3.          
  4.         $("div#Processing").show();  
  5.         var imgSrc = '<%=ResolveUrl("~/Images/Checkout/placeOrder_processing.gif") %>';  
  6.         $("td#imgSection").append("<img src='" + imgSrc + "'/>");  
  7.           
  8.     }     
  9. </script></font>  

这样,在可见的内容中将Img加入到DOM中就可以解决这个问题了。
--EOF--
贴出这个案例地址是在:http://www.cnblogs.com/zlgcool/archive/2010/03/15/1686507.html,真的很意外的例子,所以就记录下来了




本站采用创作共享版权协议, 要求署名、非商业和保持一致. 本站欢迎任何非商业应用的转载, 但须注明出自"膘叔", 保留原始链接, 此外还必须标注原文标题和链接.

« 上一篇 | 下一篇 »

2条记录访客评论

博主我转载了,ok?

Post by 72色 on 2010, March 16, 6:19 PM 引用此文发表评论 #1

在A标签中执行函数,如果是在href中执行,那么GIF就会停止不同,换成在onclick里执行就OK了

Post by tdweb on 2010, March 16, 11:34 AM 引用此文发表评论 #2


发表评论

评论内容 (必填):