gpt4 book ai didi

javascript - SVG 元素的动态动画在 IE 中不起作用

转载 作者:塔克拉玛干 更新时间:2023-11-02 21:33:43 24 4
gpt4 key购买 nike

我试图在使用 jquery 动态添加 DOM 元素的同时制作 SVG 元素的动画。如果我在 <body> 中添加这些元素如下其工作。工作样本是 http://jsfiddle.net/bZdfH/2/

<svg>
<script type="text/ecmascript" xlink:href="http://leunen.me/fakesmile/smil.user.js"/>
<circle cx="60" cy="60" r="20" style="fill: pink; stroke: red;" >
<animate attributeName="r" dur="4s" values="20; 0; 20" repeatCount="indefinite"/>
</circle>
</svg>

当我动态添加它时,动画不会在 IE 中启动,但它适用于 Chrome 和 FireFox。这就是我所拥有的。

<svg>
<script type="text/ecmascript" xlink:href="http://leunen.me/fakesmile/smil.user.js"/>
<circle cx="60" cy="60" r="20" style="fill: pink; stroke: red;" onmouseover="changeImage(this)" >
</circle>
</svg>
<script>
function changeImage(circle) {
while (circle.firstChild) {
circle.removeChild(circle.firstChild);
}
circle.setAttributeNS(null, "fill", "blue");
var animate = document.createElementNS("http://www.w3.org/2000/svg", "animate");
animate.setAttributeNS(null, "attributeName", "r");
animate.setAttributeNS(null, "values", "20;0;20");
animate.setAttributeNS(null, "dur", "6s");
animate.setAttributeNS(null, "repeatCount", "indefinite");
circle.appendChild(animate);
}
</script>

这里是 jsfiddle对于工作示例。有人可以帮助我吗??

最佳答案

IE 不支持 SMIL 动画。来源:http://caniuse.com/#search=svg

关于javascript - SVG 元素的动态动画在 IE 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20564962/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com