不同浏览器中的CSS动画

Question

在谷歌浏览器中使用下面的动画代码可以正常工作。

在Firefox和IE中它根本不起作用。

这个想法是有两个背景图像，一个缺少斑点，另一个图像只是斑点。

随着动画的发生，丢失的点在动画循环中淡入淡出。

就像我说的，它在谷歌浏览器中表现完美。如何让它与Firefox和IE一起使用？

        @keyframes web_butanim
        {
            from {
            background-image: url(./web_button1.png);
          }

          to {
            background-image: url(./web_button2.png);
          }

        }

        #Websites_but
        {
            background-image: url(./web_button1.png);
            background-size:cover;
            animation-duration:0.8s;
            animation-name:web_butanim;
            animation-iteration-count: infinite;                
        }

提前致谢。