我想在用户向下滚动时触发SVG动画(编码到SVG文件本身中)。我相信这是通过设置"开始:无限期" on""然后在用户滚动时用jquery / js将其设置为0?我尝试过的任何东西似乎都没有工作,所以我想知道是否有人可以给我一些更好的方向来实现这个目标。
答案 0 :(得分:2)
将动画元素的开始时间设置为“0”表示它在文档加载后立即开始。由于文档已经在用户滚动时加载,因此此时不会产生任何影响。
要使用Javascript触发动画元素,请使用beginElement()
或beginElementAt(delayInSeconds)
方法。第一种方法立即启动元素,第二种方法在指定的延迟后启动。 More info in the SVG specs
window.addEventListener('scroll', function(e){
document.getElementById("animateOnScroll")
//.setAttribute("begin", 0); //this doesn't work!
.beginElement(); //this does!
});