动画 GIF 在 IE 中停止，但在 FF 和 Chrome 中有效答案

【问题标题】：Animated GIF is stopping in IE but works in FF and Chrome动画 GIF 在 IE 中停止，但在 FF 和 Chrome 中有效
【发布时间】：2015-05-02 15:17:33
【问题描述】：

我试图在按钮单击时显示动画 GIF，但它在 IE (8,9) 中被冻结，在 IE11、FF 和 Chrome 中有效。

有什么解决方法吗？

这里是html代码；

   <!DOCTYPE html>

        <html xmlns="http://www.w3.org/1999/xhtml">
        <head runat="server">


        <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/start/jquery-ui.css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
            <title></title>

            <style type="text/css">

            .cssbox-progress { 
            background-image: url('images/3.gif'); 
            background-repeat: no-repeat;  
            }

            .loading
            {
                width: 50px;
                height: 10px;
                 display: none;
                background-color: White;                  
            }

        </style>

        <script >
            function ShowProgress() {
                setTimeout(function () {

                    var loading = $(".loading");
                    loading.show();
                }, 200);
            }
            function test() {
                ShowProgress();
            }

        </script>

        </head>
        <body>
            <form id="form1" runat="server">
                 <div class="loading" align="center" style="width: 50px; height: 10px; ">

                <div class="cssbox-progress" style="width: 50px; height: 10px;"></div>

                </div>

      <asp:Button ID="btn" runat="server" Text="Login" onclientclick ="test()"  />


            </form>
        </body>
        </html>

动画 GIF

【问题讨论】：

我强烈怀疑 IE 8 和 9 是否支持动画 GIF 作为 div 背景图像。改用标签（为什么不呢？）此外，您的代码显示$(".loading")，而$(".loading") 只是一个空的div。我认为它完全符合它应该做的事情:)
我不确定是否可以使用图像标签，因为 GIF 图像需要在 css 中设置。
是的，您可以使用图像标签。这就是 Jeremy 所说的问题，IE8,9 上的背景图像不支持动画。
我可以在css中设置图片src吗？ CSS 不用于定义 DOM 元素属性的值
是content : url("images/3.gif")

标签： jquery html css asp.net internet-explorer

【解决方案1】：

针对 cmets，以下是场景： 1-您需要显示“加载”动画 gif。 2- GIF 在 IE 8/9 中没有动画。 3-由于您使用的是主题，因此您需要更改css中的源代码。

答案是

<style>
.cssbox-progress { 
     content: url('http://i.stack.imgur.com/dS784.gif'); 
}
</style>

和

<img class="cssbox-progress" />

虽然我没有在 IE 8 / 9 上对其进行测试，但我使用插件来测试它的外观，但您应该对其进行测试以确保。

【讨论】：