Animation.currentTime - Web API 接口参考 编辑

这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

Animation.currentTime属性返回或设置动画的当前时间值(以毫秒为单位),无论动画正在运行还是已暂停。

如果动画缺少timeline,处于非活动状态或尚未播放,则当前时间返回值为null。

语法

var currentTime = element.currentTime;
element.currentTime = someValue;

表示当前时间的数字(以毫秒为单位),或为null。

例子

Drink Me/Eat Me game中,爱丽丝的高度是可变动的,所以它可以从小到大或从大到小。 在游戏开始时,通过将她的动画的currentTime设置为她的keyframeEffect的持续时间的一半让她的高度设置在两个极端之间:

aliceChange.currentTime = aliceChange.effect.timing.duration / 2;

寻求动画的50%标记的更通用的方法:

animation.currentTime =
  animation.effect.getComputedTiming().delay +
  animation.effect.getComputedTiming().activeDuration / 2;

规范

规范状态说明
Web Animations
currentTime
Working Draft 

浏览器支持

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support39.048 (48)未实现未实现未实现
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE PhoneOpera MobileSafari MobileChrome for Android
Basic support未实现39.048.0 (48)未实现未实现未实现39.0

 

相关内容

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

词条统计

浏览:123 次

字数:4757

最后编辑:7 年前

编辑次数:0 次

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文