JavaScript HTML DOM Style transitionTimingFunction 属性

• 

  transitionTimingFunction 属性

  transitionTimingFunction属性指定过渡效果的速度曲线。此属性允许转换效果在其持续时间内改变速度。

  更改过渡效果的速度曲线：

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

  尝试一下
• 

  浏览器支持

  项	IE/Edge	Chrome	FireFox	Safari	Opera
  属性
  transitionTimingFunction	10.0+	26.0+	16.0+	6.1+ 3.1 WebkittransitionTimingFunction	12.1+

• 

  语法

  返回transitionTimingFunction属性：

  object.style.transitionTimingFunction

  设置transitionTimingFunction属性：

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

  属性值

  值	描述
  ease	默认值。 指定缓慢启动的转换效果，然后快速，然后缓慢结束（相当于cubic-bezier（0.25,0.1,0.25,1））
  linear	指定从开始到结束具有相同速度的过渡效果（相当于cubic-bezier（0,0,1,1））
  ease-in	指定慢启动的过渡效果（相当于cubic-bezier（0.42,0,1,1））
  ease-out	指定慢速结束的过渡效果（相当于cubic-bezier（0,0,0.58,1））
  ease-in-out	指定慢启动和结束的过渡效果（相当于cubic-bezier（0.42,0,0.58,1））
  cubic-bezier(n, n, n, n)	在cubic-bezier函数中定义自己的值。 可能的值是从0到1的数值
  initial	设置这个属性为默认值。 阅读有关initial信息
  inherit	从其父元素继承此属性。 阅读有关inherit的信息

• 

  技术细节

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

• 

  相关页面

  CSS参考：CSS transition-timing-function 属性