transition-timing-function屬性指定切換效果的速度。
transition-timing-function: linear|ease|ease-in|ease-out|ease-in-out|cubic-bezier(
n,
n,
n,
n);

cubic-bezier即為貝茲曲線中的繪制方法。圖上有四點,P0-3,其中P0、P3是默認的點,對應了[0,0], [1,1]。而剩下的P1、P2兩點則是我們通過cubic-bezier()自定義的。cubic-bezier(x1, y1, x2, y2) 為自定義,x1,x2,y1,y2的值范圍在[0, 1]。
預留的幾個特效:
1 ease: cubic-bezier(0.25, 0.1, 0.25, 1.0) 2 linear: cubic-bezier(0.0, 0.0, 1.0, 1.0) 3 ease-in: cubic-bezier(0.42, 0, 1.0, 1.0) 4 ease-out: cubic-bezier(0, 0, 0.58, 1.0) 5 ease-in-out: cubic-bezier(0.42, 0, 0.58, 1.0)