动画gif不再在jquery上动画.show()

时间:2011-03-28 14:38:11

标签: jquery internet-explorer internet-explorer-8 jquery-effects

据我所知,这只会影响IE 8。

使用以下代码,gif会出现,但不会被动画(卡在一个位置):

$("#<%=assessmentListLinkClientID() %>").click(function(){
        $("#assessmentListLoaderImg").show();
    });

我也使用了.css('display', 'block'),结果相同。

是否有可接受的方式(可能比这更好)产生可靠的跨浏览器结果以显示动画gif?

2 个答案:

答案 0 :(得分:6)

这似乎是解决此问题的方法:

<div id='myHiddeDiv' style='display:none'> 
<img src='' id='myAnimatedImage'> 
</div> 
<input type='button' value='show image' onclick='showDiv();'> 

<script languag='javascript'> 
function showDiv() 
{ 
document.getElementById('myHiddeDiv').style.display =""; 
document.getElementById('myAnimatedImage').src = "http://www.nowhere.com/animatedGif.gif"; 
} 
</script> 

您需要重新设置图像标记的src,这会强制IE再次渲染它,从而将其显示为动画。

答案 1 :(得分:0)

我前一段时间遇到过这个问题,虽然我没有解决这个问题,但我最近在jquery UI中发现了一些我要进一步调查的内容。在jQuery UI引擎中似乎有一个设置用于将屏幕设置为隐藏屏幕,我想知道是否可以解决IE无法正确渲染GIF动画的问题,因为它们在渲染时是不可见的。我的理论是,如果它是可见的但是“屏幕外”,那么IE可能会将其渲染为动画,但它对用户来说是不可见的。

链接在这里:

http://jqueryui.com/docs/Theming/API

这是我想到的布局助手:

.ui-helper-hidden-accessible:将可访问的隐藏应用于元素(通过abs定位离开页面)

我不能保证这是一个答案,但是当我有机会时,我可以在我的解决方案列表中尝试自己。

如果你试试这个并取得任何成功,请告诉我:)