前端动画选择----js动画和css3动画

js动画和css3动画
js实现动画，用setTimeout()setInterval(),这种叫做帧动画，每隔一段时间更改当前元素的状态
css3实现动画，这种叫补间动画，这种给定起始状态和结束状态，中间的动画游览器引擎自己去做，如animate就是用多个节点来控制动画

一般尽量选择css3动画，给定两个或多个状态，思路为当某一条件触发时，给要运动的元素加一个class类，用transition 或animate来进行动画。
div{
 opacity:0;
}
div.now{
 opacity:1;
 transition:all 1s linear 1s;
}
或
div{
 animate:div1 1s linear infinite alternate;//无穷次 逆播放
}
//定义动画序列
@keyframes div1{
 from{opacity:0;}
 to{opacity:1;}
}