動(dòng)畫停留在最后一幀
animation-fill-mode: forwards;
電池高度不定動(dòng)畫效果
http://js.jirengu.com/vupipozuju/1/edit?html,css,output
max-height
-
animation-timing-function
transition-timing-function
拋物線動(dòng)畫（By張鑫旭）
定義和用法
animation-timing-function 規(guī)定動(dòng)畫的速度曲線。
速度曲線定義動(dòng)畫從一套 CSS 樣式變?yōu)榱硪惶姿玫臅r(shí)間。
速度曲線用于使變化更為平滑。
| 值 | 描述 | 測試 |
|---|---|---|
| linear | 動(dòng)畫從頭到尾的速度是相同的。 | 測試 |
| ease | 默認(rèn)。動(dòng)畫以低速開始，然后加快，在結(jié)束前變慢。 | 測試 |
| ease-in | 動(dòng)畫以低速開始。 | 測試 |
| ease-out | 動(dòng)畫以低速結(jié)束。 | 測試 |
| ease-in-out | 動(dòng)畫以低速開始和結(jié)束。 | 測試 |
| cubic-bezier(n,n,n,n) | 在 cubic-bezier 函數(shù)中自己的值?？赡艿闹凳菑?0 到 1 的數(shù)值。 |
-
animation
animation:mymove 5s infinite;//mymove動(dòng)畫名，5s動(dòng)畫時(shí)間，infinite永久動(dòng)畫
@keyframes mymove //定義動(dòng)畫
{
from {left:0px;}
to {left:200px;}
}
