原生javascript 实现 animate
2016-04-08 23:53
585 查看
原生javascript 实现 animate
//animate function getstyle(obj,name){ if(obj.currentStyle){ return obj.currentStyle[name]; }else{ return getComputedStyle(obj,false)[name]; } } function startrun(obj,attr,target,fn){ clearInterval(obj.timer); obj.timer = setInterval(function(){ var cur = 0; if(attr == "opacity"){ cur = Math.round(parseFloat(getstyle(obj,attr))*100); }else{ cur = parseInt(getstyle(obj,attr)); } var speed = (target-cur)/8; speed = speed>0?Math.ceil(speed):Math.floor(speed); if(cur == target){ clearInterval(obj.timer); if(fn){ fn(); } }else{ if(attr == "opacity"){ obj.style.filter = "alpha(opacity="+(cur+speed)+")"; obj.style.opacity = (cur+speed)/100; }else{ obj.style[attr] = cur + speed + "px"; } } },30) }
相关文章推荐
- js第十二节-数组的方法
- 《JavaScript高级程序设计》——函数表达式
- 笔记练习:《Javascript入门经典(第5版)》page115_9.9_Practice
- js第十节-日期对象,网页时钟,倒计时
- javascript中replace与正则表达式
- js第九节-定时器的管理,函数封装
- js第八节-函数返回值,定时器基础
- JavaScript常用互动方法
- JavaScript之分之结构
- jsonp的简单原理
- js第七节-运算符,流程控制
- 解决 jsp:include 引用文件时出现乱码的问题
- 前端开发学习笔记04---JavaScript
- javascript动态在<div>中加载内容
- javascript内置对象
- javascript打算看的书
- 学习记录--javascript多态
- js第四节-数据类型以及类型的转化
- 使用js正则表达式分割内容分别显示
- JS代码试例