原生javascript 实现 animate
原生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)
}
原生javascript 实现 animate的更多相关文章
- 原生JavaScript运动功能系列(五):定时定点运动
原生JavaScript运动功能系列(一):运动功能剖析与匀速运动实现 原生JavaScript运动功能系列(二):缓冲运动 原生JavaScript运动功能系列(三):多物体多值运动 原生JavaS ...
- 原生JavaScript运动功能系列(四):多物体多值链式运动
原生JavaScript运动功能系列(一):运动功能剖析与匀速运动实现 原生JavaScript运动功能系列(二):缓冲运动 原生JavaScript运动功能系列(三):多物体多值运动 多物体多值链式 ...
- 原生 JavaScript 代替 jQuery【转】
目录 用原生JavaScript代替jQuery Query Selector CSS & Style DOM Manipulation Ajax Events Utilities Promi ...
- 原生javascript封装动画库
****转载自自己发表于牛人部落专栏的文章**** 一.前言 本文记录了自己利用原生javascript构建自己的动画库的过程,在不断改进的过程中,实现以下动画效果: 针对同一个dom元素上相继发生的 ...
- 浅谈 原生javaScript&&react 实现全局触摸按钮(附带对addeventlistener的了解)
1.采用原生javaACript 实现全局触摸按钮 首先在控制台输出,观察事件有哪些关于触摸的字段可以使用,然后拿这些字段的数据开始来写方法. 因为要做的是全局触摸按钮,我需要拿到的是按钮时时的坐标位 ...
- 你可能不需要 jQuery!使用原生 JavaScript 进行开发
很多的 JavaScript 开发人员,包括我在内,都很喜欢 jQuery.因为它的简单,因为它有很多丰富的插件可供使用,和其它优秀的工具一样,jQuery 让我们开发人员能够更轻松的开发网站和 We ...
- 原生JavaScript技巧大收集(11~20)-(终于又被我找到这篇文章了)
11.原生JavaScript加入收藏夹 function AddFavorite(sURL, sTitle) { try { window.external.addFavorite(sURL, sT ...
- 原生javascript加载运行
原生javascript加载运行 (function(){ //TODO sometings }()); 在要运行相应代码的位置加入script标签,创建函数并自执行; 关于window.onload ...
- 原生javascript模仿win8等待进度条。
一.序言 一直很中意win8等待提示圆圈进度条.win8刚出来那会,感觉好神奇!苦于当时没思路,没去研究.通过最近网上找找资料,终于给搞出来了!先上Demo,献丑了!预览请看:win8进度条. 二.简 ...
随机推荐
- 利用sphinx为python项目生成API文档
sphinx可以根据python的注释生成可以查找的api文档,简单记录了下步骤 1:安装 pip install -U Sphinx 2:在需要生成文档的.py文件目录下执行sphinx-apido ...
- Hibernate 系列 05 - Session 类
引导目录: Hibernate 系列教程 目录 前言: Session是Hibernate运作的中心,对象的生命周期.事务的管理.数据库的存取都与Session息息相关. 就如同在编写JDBC时需要关 ...
- (八)map,filter,flatMap算子-Java&Python版Spark
map,filter,flatMap算子 视频教程: 1.优酷 2.YouTube 1.map map是将源JavaRDD的一个一个元素的传入call方法,并经过算法后一个一个的返回从而生成一个新的J ...
- PHP curl 函数
转载http://sunking.sinaapp.com/archives/111 最近使用curl的时候,发现了一个比较好用的函数,当然是初级者适用的一个函数,就是curl_getinfo(), 在 ...
- IT技术思维导图
在网上看到有个人总结的java技术的东东,觉得很好,就保存下来了,码农还真是累啊,只有不断的学习才能有所提高,才能拿更多的RMB啊. java技术思维导图 服务端思维导图 前端思维导图
- 《饥荒游戏》SW BUG 刷猴子 & 刷淘气值 办法
简介 该办法利用刷猴子的方式,通过杀猴子获取淘气值,从而刷出坎普斯,继而刷坎普斯背包 物品准备 灭火器x1 箱子x1 逗猴球x1 猴窝xN 帽贝岩x2 避雷针x1 操作步骤 1.灭火器建造在2个帽贝岩 ...
- IISExpress Log 文件路径
问题 用VS做开发时经常用IISExpress测试web程序,那么在测试过程中生成的Log文件放在哪里了? 答案 情况1 默认情况下 applicationhost.config 文中定义了连个日志文 ...
- flex自适应高度内容高度超出容器高度自动出现滚动条的问题
在容器中设置 flex-grow:2; overflow-y:auto;overflow-x:hidden;容器高度自适应. 内容高度不固定,无法出现滚动条,然后在容器中添加height:0,出现滚动 ...
- webBrowser1
HTMLDocument类的引用 using mshtml;
- 给空签名包进行签名以及找不到keystore证书链问题的解决方案
转 http://blog.csdn.net/u011106842/article/details/49683865