是否可以跳到特定时间并在点按文本后开始播放动画？
<!-- All working as expected -->
<h1 on="tap:anim1.restart;">Restart</h1>
<h1 on="tap:anim1.pause;">Pause</h1>
<h1 on="tap:anim1.start;">Start</h1>
<h1 on="tap:anim1.seekTo(time=3000);">Seek 3s</h1>
<!-- NOT working ... -->
<h1 on="tap:anim1.start(time=3000);">Start from xx</h1>
<h1 on="tap:anim1.seekTo(time=3000),anim1.start;">Start from xx</h1>
答案 0 :(得分：0)
页面重新加载后，您的代码
on="tap:anim1.seekTo(time=3000),anim1.start;"
工作正常。否则，我需要添加重新启动
on="tap:anim1.restart,anim1.seekTo(time=5000),anim1.start;"
我认为这是一个错误，但至少您有解决方法。尝试在整页上运行下面附带的代码。
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<title>Hello World</title>
<script async custom-element="amp-animation" src="https://cdn.ampproject.org/v0/amp-animation-0.1.js"></script>
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style amp-custom>
h1 {
transform-origin: left;
}
</style>
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
</head>
<body>
<amp-animation id="anim1" layout="nodisplay">
<script type="application/json">
{
"duration": "10s",
"animations": [{
"selector": "#title",
"keyframes": [
{"transform": "scale(1)", "opacity": 0},
{"transform": "scale(2)", "opacity": 1}
]
}]
}
</script>
</amp-animation>
<h1 style="font-family: courier;" id=title>0123456789ABCDEF</h1>
<h1 style="font-family: courier">0123456789ABCDEF</h1>
<!-- All working as expected -->
<span tabindex=0 role="button" on="tap:anim1.restart;">Restart</span> |
<span tabindex=0 role="button" on="tap:anim1.pause;">Pause</span> |
<span tabindex=0 role="button" on="tap:anim1.start;">Start</span> |
<span tabindex=0 role="button" on="tap:anim1.seekTo(time=3000);">Seek 3s</span>
<!-- NOT working ... -->
<br/><span tabindex=0 role="button" on="tap:anim1.seekTo(time=5000),anim1.start;">Seek=5s, start (works only a fresh page reload)</span>
<br/><span tabindex=0 role="button" on="tap:anim1.restart,anim1.seekTo(time=5000),anim1.start;">Restart, seek=5s, start</span>
</body>
</html>