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
  • 相关页面