如何讓自定義的CSS動畫/躍變定時功能

Question

CSS定時功能似乎總是2點之間：

即使定製貝塞爾曲線，你的曲線只能去從一個點到另一個。

是否有可能使自定義CSS定時功能，在這裏你可以做一個由多個點的曲線？

Answer 1

我們有以下計時功能。

transition-timing-function: ease; 
transition-timing-function: linear; 
transition-timing-function: step-end; 
transition-timing-function: steps(4, end); 

我希望在未來我們能獲得更多。現在，我們有時間的百分比撥弄創建像自定義定時：

@keyframes wordsAnimationZoomIn{ 
    0%{ 
     opacity: 0; 
    } 
    25%{ 
     opacity: 0.5; 
    } 
    75%{ 
     opacity: 0.5; 
    } 
    100%{ 
     opacity: 1; 
    } 
} 

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions