2014-10-06 77 views
0

Animate svg + xml base 64在IE> 9(以前的版本不考虑)中的css背景不起作用,Firefox和其他工作都可以正常工作。Animate svg + xml base 64 css背景无法在IE中工作

这里是背景属性:

背景:URL(“数据:图像/ SVG + xml的; BASE64,PHN2ZyB4bWw6c3BhY2U9InByZXNlcnZlIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHZpZXdCb3g9IjAgMCAyNCAzMCIgaGVpZ2h0PSIzMHB4IiB3aWR0aD0iMjRweCIgeT0iMHB4IiB4PSIwcHgiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiPgogICAgPHJlY3Qgb3BhY2l0eT0iMC4yIiBmaWxsPSIjMDA5MWZmIiBoZWlnaHQ9IjEwIiB3aWR0aD0iNCIgeT0iMTAiIHg9IjAiPgogICAgICA8YW5pbWF0ZSByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgZHVyPSIwLjZzIiBiZWdpbj0iMHMiIHZhbHVlcz0iMC4yOyAxOyAuMiIgYXR0cmlidXRlVHlwZT0iWE1MIiBhdHRyaWJ1dGVOYW1lPSJvcGFjaXR5Ii8 + CiAgICAgIDxhbmltYXRlIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBkdXI9IjAuNnMiIGJlZ2luPSIwcyIgdmFsdWVzPSI xMDsgMjA7IDEwIiBhdHRyaWJ1dGVUeXBlPSJYTUwiIGF0dHJpYnV0ZU5hbWU9ImhlaWdodCIvPgogICAgICA8YW5pbWF0ZSByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgZHVyPSIwLjZzIiBiZWdpbj0iMHMiIHZhbHVlcz0iMTA7IDU7IDEwIiBhdHRyaWJ1dGVUeXBlPSJYTUwiIGF0dHJpYnV0ZU5hbWU9InkiLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IG9wYWNpdHk9IjAuMiIgZmlsbD0iIzAwOTFmZiIgaGVpZ2h0PSIxMCIgd2lkdGg9IjQiIHk9IjEwIiB4PSI4Ij4KICAgICAgPGFuaW1hdGUgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGR1cj0iMC42cyIgYmVnaW49IjAuMTVzIiB2YWx1ZXM9IjAuMjsgMTsgLjIiIGF0dHJpYnV0ZVR5cGU9IlhNTCIgYXR0cmlidXRlTmFtZT0ib3BhY2l0eSIvPgogICAgICA8YW5pbWF0ZSByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgZHVyPSIwLjZzIiBiZWdpbj0iMC4xNXMiIHZhbHVlcz0iMTA7IDIwOyAxMCIgYXR0cmlidXRlVHlwZT0iWE1MIiBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiLz4KICAgICAgPGFuaW1hdGUgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGR1cj0iMC42cyIgYmVnaW49IjAuMTVzIiB2YWx1ZXM9IjEwOyA1OyAxMCIgYXR0cmlidXRlVHlwZT0iWE1MIiBhdHRyaWJ1dGVOYW1lPSJ5Ii8 + CiAgICA8L3JlY3Q + CiAgICA8cmVjdCBvcGFjaXR5PSIwLjIiIGZpbGw9IiMwMDkxZmYiIGhlaWdodD0iMTAiIHdpZHRoPSI0IiB5PSIxMCIgeD0iMTYiPgogICAgICA8YW5pbWF 0ZSByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgZHVyPSIwLjZzIiBiZWdpbj0iMC4zcyIgdmFsdWVzPSIwLjI7IDE7IC4yIiBhdHRyaWJ1dGVUeXBlPSJYTUwiIGF0dHJpYnV0ZU5hbWU9Im9wYWNpdHkiLz4KICAgICAgPGFuaW1hdGUgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGR1cj0iMC42cyIgYmVnaW49IjAuM3MiIHZhbHVlcz0iMTA7IDIwOyAxMCIgYXR0cmlidXRlVHlwZT0iWE1MIiBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiLz4KICAgICAgPGFuaW1hdGUgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGR1cj0iMC42cyIgYmVnaW49IjAuM3MiIHZhbHVlcz0iMTA7IDU7IDEwIiBhdHRyaWJ1dGVUeXBlPSJYTUwiIGF0dHJpYnV0ZU5hbWU9InkiLz4KICAgIDwvcmVjdD4KICA8L3N2Zz4 =“)不重复滚动中心中心透明;

如果有人知道为什么它不是在IE> 9动画,它将是伟大的!

非常感谢。

+0

在与性能相关的旁注中,base64图像不会被浏览器缓存,因此您在使用它时可能需要考虑。 – 2014-10-28 11:47:11

回答

0

IE不支持SMIL,因此忽略<animate>标记。

可以找到当前浏览器支持的最新概览here

+0

好的,谢谢! 因此,如果我很好理解,即使我将它转换成svg文件,它也不会起作用! 我需要在IE中完成这项工作。问题是我需要透明度,所以我不能在Animated gif中转换它。 而我不想使用CSS3 ... 在此先感谢 – jean 2014-10-06 10:47:12

+0

听起来就像你已经把自己涂在一个角落里,从你提供的限制无法逃脱。 – 2014-10-06 13:11:22