您可以将 SVG 文件嵌入到 (X)HTML 5 文档中:
<object data="anim.svg" id="svganim"/>
或者
<img src="anim.svg" alt="embedded SVG"/>
但如果anim.svg
是动画,则动画将在页面加载后立即开始播放。
如何嵌入动画 SVG 文件以使动画开始时暂停?然后用户可以通过按下按钮来播放动画(unpauseAnimations()
在 Javascript 中使用)
不优雅的方式
window.onload = function() {
var svg_anim = document.getElementById('svganim').contentDocument.rootElement;
svg_anim.pauseAnimations();
};
缺点:如果嵌入的 SVG 与父文档处于不同的安全上下文中,这将不起作用。有没有更好的办法?