如何仅在路径的一部分上使用animateMotion？
如何仅在路径的一部分上使用animateMotion？
提问于 2011-10-07 21:28:24
我有一条路径，我想让一个元素(在本例中是image)沿着这条路径移动。但我只想让它沿着路径的一部分动起来。在那里等待，直到用户交互，然后沿路径的其余部分设置动画。
对于其他动画，您始终可以指定from和to属性。我的想法是你可以这样做：
JavaScript
//user press some key
animationElement.setAttribute("from", "0.0"); //beginning of path
animationElement.setAttribute("to", "0.5"); //middle of path
animationElement.beginElement();
...
//user presses another key
animationElement.setAttribute("from", "0.5"); //middle of path
animationElement.setAttribute("to", "1.0"); //end of path
animationElement.beginElement();svg
<path id="myPath" d="m1119,29l-80,137l-601,52l-152,318l-381,218" stroke="#000000" fill="none" pathLength="1" />
<image xlink:href="someImage.png" width="231" height="262">
<animateMotion fill="freeze" begin="indefinite" end="indefinite" from="0" to="0.4">
<mpath xlink:href="#myPath" />
</animateMotion>
</image>Stack Overflow用户
发布于 2011-11-11 23:20:10
您是否考虑过将motionpath拆分为两部分，然后更改mpath元素上的xlink:href？
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7687946
复制相关文章
相似问题
腾讯云开发者
