【css】动画animation

动画停留在最后一帧

animation-fill-mode: forwards;

电池高度不定动画效果

http://js.jirengu.com/vupipozuju/1/edit?html,css,output

max-height

• animation-timing-function

transition-timing-function
抛物线动画（By张鑫旭）

定义和用法

animation-timing-function 规定动画的速度曲线。
速度曲线定义动画从一套 CSS 样式变为另一套所用的时间。
速度曲线用于使变化更为平滑。

值	描述	测试
linear	动画从头到尾的速度是相同的。	测试
ease	默认。动画以低速开始，然后加快，在结束前变慢。	测试
ease-in	动画以低速开始。	测试
ease-out	动画以低速结束。	测试
ease-in-out	动画以低速开始和结束。	测试
cubic-bezier(n,n,n,n)	在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。

---

• animation

animation:mymove 5s infinite;//mymove动画名，5s动画时间，infinite永久动画
@keyframes mymove      //定义动画
{
  from {left:0px;}
  to {left:200px;}
}