JavaScript HTML DOM Style animationTimingFunction 属性

• 

  animationTimingFunction 属性

  animationTimingFunction指定动画的速度曲线。速度曲线定义动画用于从一组CSS样式更改为另一组CSS样式的TIME。速度曲线用于平滑地进行更改。

  更改<div>元素的animationTimingFunction属性：

  document.getElementById("myDIV").style.animationTimingFunction = "linear";

  尝试一下
• 

  浏览器支持

  项	IE/Edge	Chrome	FireFox	Safari	Opera
  属性
  animationTimingFunction	不支持	43.0+	16.0+ 5.0 Moz	9.0+	30.0

• 

  语法

  返回animationTimingFunction属性：

  object.style.animationTimingFunction

  设置animationTimingFunction属性：

  object.style.animationTimingFunction = "linear|ease|ease-in|ease-out|cubic-bezier(n, n, n, n)|initial|inherit"
• 

  属性值

  值	描述
  linear	动画从头到尾具有相同的速度
  ease	默认值。 动画开始缓慢，然后快速，慢慢结束
  ease-in	动画开始很慢
  ease-out	动画结尾很慢
  ease-in-out	动画既有慢启动又有慢速结束
  cubic-bezier(n, n, n, n)	在cubic-bezier函数中定义自己的值，可能的值是从0到1的数值
  initial	将此属性设置为其默认值。 阅读有关initial信息
  inherit	从其父元素继承此属性。 阅读有关inherit的信息

• 

  技术细节

  项目	描述
  默认值：	ease
  返回值：	一个字符串，表示元素的animation-timing-function属性
  CSS版本	CSS3

• 

  相关页面

  CSS参考：animation-timing-function属性