HTML DOM Style transitionTimingFunction 属性

我要月亮奔我而来

Style transitionTimingFunction 属性

改变过渡效果的速度曲线:

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


定义和用法

transitionTimingFunction 属性规定过渡效果的速度曲线。

该属性允许过渡效果随着时间来改变其速度。


浏览器支持

HTML DOM Style transitionTimingFunction 属性 HTML DOM Style transitionTimingFunction 属性 HTML DOM Style transitionTimingFunction 属性 HTML DOM Style transitionTimingFunction 属性 HTML DOM Style transitionTimingFunction 属性

Internet Explorer 10、Firefox、Opera 和 Chrome 支持 transitionTimingFunction 属性。

Safari 支持另一个可替代该属性的属性,即 WebkitTransitionTimingFunction 属性。

注意:Internet Explorer 9 及其之前的版本不支持 transitionTimingFunction 属性。


语法

返回 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


版权声明:本页面内容旨在传播知识,为用户自行发布,若有侵权等问题请及时与本网联系,我们将第一时间处理。E-mail:284563525@qq.com

目录[+]

取消
微信二维码
微信二维码
支付宝二维码