使用原生JS实现一个风箱式的demo，并封装了一个运动框架

声明，该DEMO依托于某个培训机构中，非常感谢这个培训结构。话不多说，现在开始改demo的制作。

首先，在前端的学习过程中，轮播图是我们一定要学习的，所以为了更加高效的实现各种轮播图，封装了一个运动的框架。

 1 function getStyle(obj,attr) { 2   if(obj.currentStyle){ 3     return obj.currentStyle[attr];//为了获取IE下的属性值 4   }else{ 5     return window.getComputedStyle(obj,null)[attr];//为了获取W3C浏览器下的属性值 6   } 7 } 8  9 function animate(obj,json){10   clearInterval(obj.timer);11   obj.timer = setInterval(function () {12     var flag = true;13     var current = 0;14     for(var attr in json){15       if(attr == 'opacity'){16         current = parseInt(getStyle(obj,attr)*100);17       }else{18         current = parseInt(getStyle(obj,attr));19       };20 21       var step = (json[attr] - current) / 10;22       step = step > 0 ? Math.ceil(step) : Math.floor(step);23       //先判断属性是否为透明度24       if(attr == 'opacity'){25         //首先判断浏览器是否支持opacity26         if('opacity' in obj.style){27           obj.style.opacity = (current + step) / 100;28         }else{29           obj.style.filter = 'alpha(opacity = ' + (current + step) + ')';30         }31       //再判断属性是否为z-index32       }else if(attr == 'zIndex'){33         obj.style.zIndex = json[attr];34       //最后再判断35       }else{36         obj.style[attr] = current + step + 'px';37       }38 39       if(current != json[attr]){40         flag = false;41       }42     }43 44     if(flag){45       clearInterval(obj.timer);46     }47   },5);48 }

原标题：使用原生JS实现一个风箱式的demo，并封装了一个运动框架

关键词：JS