CSS3의 애니메이션 - 변환 함수transition-timing-function

transition-timing-function 속성은 과도 효과의 속도 곡선을 규정합니다.JavaScript 구문:

object.style.transitionTimingFunction="linear"

transition-timing-function 구문:

transition-timing-function: linear|ease|ease-in|ease-out|ease-in-out|cubic-
bezier(n,n,n,n);

linear는 같은 속도로 시작해서 끝날 때의 과도 효과(cubic-bezier(0,0,1,1)를 규정한다.ease는 느린 속도로 시작해서 빨라지고 느린 속도로 끝나는 과도 효과(cubic-bezier(0.25,0.1,0.25,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 사이의 값입니다.