js动画(运动框架)
2016-07-13 21:10
555 查看
function startMove(obj,json,fn){ var flag=true;//假设所有的运动都到达终点 clearInterval(obj.timer); obj.timer=setInterval(function(){ for(attr in json){ //1取当前值 var icur=0; if (attr=='opacity') { icur=parseFloat(getStyle(obj,attr))*100; } else { icur=parseInt(getStyle(obj,attr)); } //2算速度 var speed=(json[attr]-icur)/8; speed=speed>0?Math.ceil(speed):Math.floor(speed);//清除小数 //3检测停止,没有判断所有的都到达终点 if (icur!=json[attr]){ flag=false; } if (attr=='opacity') { obj.style.filter='alpha(opacity:'+(icur+speed)+')'; obj.style.opacity=(icur+speed)/100; } else { obj.style[attr]=icur+speed+'px'; } if(flag){ clearInterval(obj.timer); if (fn) { fn(); } } } },30); } //获取属性方法 function getStyle(obj,attr){ if (obj.currentStyle) { return obj.currentStyle[attr];//针对IE浏览器 } else { return getComputedStyle(obj,false)[attr];//针对火狐浏览器 } }
相关文章推荐
- js调试的一点小知识
- JavaScript学习
- sublime text3的CSS格式化----HTML-CSS-JS Prettify
- JavaScript笔记
- javascript原理系列— new的原理
- 浅谈JSON
- touch.js-drag
- touch.js-rotate
- touch.js-scale
- touch.js-swipe
- touch.js2
- touch.js
- swiper.js3
- JVM性能调优监控工具jps、jstack、jmap、jhat、jstat使用详解
- swiper.js2
- swiper.js1
- swiper.js
- jackson 实体转json 为NULL或者为空不参加序列化
- javascript 常用技巧
- 踩坑笔记——JavaScript判断回文程序