SVG动画和IE(和snap.svg)。动画路径stroke-dashoffset

时间:2016-10-28 10:25:50

标签: javascript internet-explorer svg snap.svg

我有一个SVG,我正在尝试设置stroke-dashoffset属性的动画。最初我编写的代码可以在Internet Explorer中工作,但后来我意识到只有当你自然地从页面链接到我正在构建的网站内的链接时才有效,但当你刷新页面时,Internet Explorer决定它不喜欢它和它不再起作用了。

然后我在网上看到snap.svg库应该是IE友好的,所以我尝试实现它...事实证明我可以用一行代码使用snap.svg实现我之前所做的... ...我哈哈之前在大约50行中实现了它...虽然没有必须包含snap.svg所以我仍然不确定哪个更好......无论如何......那行代码是:

snapPath.animate({'stroke-dashoffset':stopOffset}, 1000);

snapPath的定义如下:

var snapMap = Snap('#map'),
    snapPath = snapMap.select('#route_1_overlay');

并且stopOffset变量只是一个数字。

我想我的问题是,为什么只有当我通过我网站上的其他链接访问该页面然后在刷新时停止工作?它与IE中的标题有关吗? (这对我来说绝对没有意义,但我能想到的唯一可能与之不同的东西?)

此时我愿意让冲程 - dashoffset只是跳到我给它的值而不是动画它,但我也尝试了有限的成功,所以我愿意建议能够实现这一点IE也是如此。

所有这一切都被说成如果有人能够在IE中制作动画的答案,那我就是耳朵!

我只关心IE10 +和Edge。

干杯!

0 个答案:

没有答案