HTML DOM propiedad Estilo transitionTimingFunction
Ejemplos
Cambiar la velocidad de la curva de efecto de transición:
document.getElementById("myDIV").style.transitionTimingFunction="linear";
Trate »
Definición y Uso
atributo transitionTimingFunction especifica la velocidad de la curva de efecto de transición.
Esta propiedad permite que el efecto de transición en el tiempo para cambiar su velocidad.
Soporte para el navegador
Internet Explorer 10, Firefox, Opera y Chrome apoyo transitionTimingFunction propiedad.
Safari es compatible con otra alternativa de la propiedad de atributos que la propiedad WebkitTransitionTimingFunction.
Nota: Internet Explorer 9 y versiones anteriores no son compatibles con la propiedad transitionTimingFunction.
gramática
transitionTimingFunction propiedades para la espalda:
object .style.transitionTimingFunction
Configuración de las propiedades transitionTimingFunction:
object .style.transitionTimingFunction ="ease|linear|ease-in|ease-out|ease-in-out|cubic-bezier()|
initial|inherit"
initial|inherit"
propiedad Valor
值 | 描述 |
---|---|
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 。 |
detalles técnicos
Por defecto: | facilidad |
---|---|
Devuelve: | Cadena que representa el elemento de propiedad-tiempo-función de transición. |
versión CSS | CSS3 |
Artículos relacionados
CSS Referencia: Transición-Timing la propiedad funciones