学习笔记-animate动画函数
动画原理：当前的样式+变化量
获得当前的样式
印象普陀
1function getStyle(obj,attr) {
2if(obj.currentStyle) { //ie
3return obj.currentStyle[attr];
4 }el { //w3c
ComputedStyle(obj,null)[attr];
6 }
7 }
动画函数（⽆opacity和z-index）
1function animate(obj,json){ //要做动画的对象，⽬标样式
2 clearInterval(obj.timer); //清除定时器
3 obj.timer = tInterval(function(){ //开启定时器
4var flag = true; //定时器开关
5for(var key in json){ //遍历json
6var current = parInt(getStyle(obj,key)) || 0; //获取当前的属性值
7var step = (json[key] - current) / 10; //计算每个属性的变化量
8 step = step > 0 ? il(step) : Math.floor(step); //根据正负取整
9 obj.style[key] = current + step + "px"; //赋值
10if(current != json[key]){//只要其中有⼀个属性不等于⽬标值，就不应该停⽌定时器
11 flag = fal;
12 }
13 }
14if(flag){ // 当flag为真时，停⽌定时器
15 clearInterval(obj.timer);
16 }
17 },30);
18 }
动画函数（添加回调函数、opacity和z-index）
1function animate(obj,json,fn){
糯米鸡2 clearInterval(obj.timer);
3 obj.timer = tInterval(function(){
4var flag = true;
5for(var key in json){
疙瘩菜
6var current = 0;
7if(key == "opacity"){ //如果⽬标属性中有透明度
8 current = und(parInt(getStyle(obj,key)*100)) || 0;//获得的opacity属性值要先乘以100
9 }el{
10 current = parInt(getStyle(obj,key));
11 }
12var step = (json[key] - current) / 10; //计算每个属性值的变化量
13 step = step > 0 ? il(step) : Math.floor(step);
14if(key == "opacity"){//判断传⼊的json中有没有opacity
西游记后续15if("opacity" in obj.style){//判断浏览器是否⽀持opacity
情之缘
16 obj.style.opacity = (current + step) / 100;//⾮ie
17 }el{
18 obj.style.filter = "alpha(opacity = "+(current + step)*10+")"; //ie ⽀持滤镜 filter : alpha(opacity = 50);
19 }
20 }el if(key == "zIndex"){ //判断是否有zIndex鼠五行属什么
21 obj.style.zIndex = json[key];//直接变成⽬标值
22 }
23el{
24 obj.style[key] = current + step + "px";
25 }
26if(current != json[key]){//只要其中有⼀个属性不等于⽬标值，就不应该停⽌定时器老虎蛋糕图片
27 flag = fal;
28 }
29 }
30if(flag){ // 当flag为真时，停⽌定时器
31 clearInterval(obj.timer);
32if(fn){ //判断是否存在回调函数，如果存在，定时器停⽌时，执⾏回调函数
33 fn(); //执⾏回调函数
34 }
35 }
36 },30);
营销部是做什么的
37 }
