function startMove(obj, json, endFun) {
//开始前关闭之前obj上的定时器
clearInterval(obj.timer); //定时器
obj.timer = setInterval(function() { var bStop = true; //假设所有值都到目标
for(var attr in json) {//循环json数组 //单独处理透明度
if(attr == 'opacity') {
var cur = Math.round(parseFloat(getStyle(obj, attr)) * 100);
} else {
var cur = parseInt(getStyle(obj, attr));
}
//速度处理
var speed = (json[attr] - cur) / 6;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed); //如果当前的没到目标值
if(cur != json[attr])
bStop = false; //运动
if(attr == 'opacity') {
obj.style.opacity = (cur + speed) / 100;
obj.style.filter = 'alpha(opacity:' + (cur + speed) + ')';
} else {
obj.style[attr] = cur + speed + 'px';
}
}
//所有的都到达目标值
if(bStop) {
clearInterval(obj.timer);
if(endFun) endFun();
}
}, 30); }

带回调函数的js运动框架的更多相关文章

  1. 带无缝滚动的轮播图(含JS运动框架)

    今天学习了一下轮播图的写作,想到前一阵学过的无缝滚动得思想,所以就把轮播与滚动结合了一下.不过我的代码的神逻辑我自己都不敢恭维,在没网没参照的情况下,只能硬着头皮往下写,希望跟大家共勉吧. js运动框 ...

  2. js 运动框架-轻量级

    具体代码如下: function move(obj,json,sv,fnEnd){ //CSS样式值 function getStyle(obj,attr){ if(obj.currentStyle) ...

  3. js运动框架之一条乱跑的虫子

    克隆与运动框架的联合应用 效果:点击元素块后,元素块开始随机的向任何方向移动,并附带一堆颜色随机的"尾巴".每个方向运动3秒后改变方向,同时笑脸变哭脸. 如图所示: 朝某个方向运动 ...

  4. Easyui中 alert 带回调函数的 消息框

    带回调函数的 消息框: $.messager.alert({ title:'消息', msg:'电话号码 只能是数字!', icon: 'info', width: 300, top:200 , // ...

  5. js运动框架逐渐递进版

    运动,其实就是在一段时间内改变left.right.width.height.opactiy的值,到达目的地之后停止. 现在按照以下步骤来进行我们的运动框架的封装: 匀速运动. 缓冲运动. 多物体运动 ...

  6. js运动框架 step by step

    开启setInterval定时器之前,请先清除之前的定时器 window.onload = function() { var btn = document.getElementById('btn'); ...

  7. 详解回调函数——以JS为例解读异步、回调和EventLoop

      回调,是非常基本的概念,尤其在现今NodeJS诞生与蓬勃发展中变得更加被人们重视.很多朋友学NodeJS,学很久一直摸不着门道,觉得最后在用Express写Web程序,有这样的感觉只能说明没有学懂 ...

  8. js运动框架之掉落的扑克牌(重心、弹起效果)

    玩过电脑自带纸牌游戏的同志们应该都知道,游戏过关后扑克牌会依次从上空掉落,落下后又弹起,直至"滚出"屏幕. 效果如图:    这个案例的具体效果就是:点击开始运动,纸牌会从右上角掉 ...

  9. JS运动框架的封装过程(一)

    给大家出一道题,从起点A走到目的地B,一共用了1000毫秒,每一次是30毫秒,请问你在这里面得到了哪些信息? 信息有哪些呢? 第一个,总时长是:1000毫秒 第二个,多久时间走一次?30毫秒 第三个, ...

随机推荐

  1. win10家庭版快速升级专业版

    win10家庭普通版升级专业版方法: 1.点击“开始”,选择控制面板. 2.点击“系统与安全”,选择“Windows Anytime Upgrade”.(或者:单击「开始」按钮,在搜索框中,键入any ...

  2. C# Winform学习---MDI窗体的设计,PictureBox控件(图片上一页下一页),Timer控件,MenuStrip控件

    一.MDI窗体的设计 1.MDI简介 MDI(Multiple Document Interface)就是所谓的多文档界面,与此对应就有单文档界面 (SDI), 它是微软公司从Windows 2.0下 ...

  3. pynotify

    import pynotify,sys if not pynotify.init('a'): sys.exit(1) n=pynotify.Notification('title','info','f ...

  4. bootstrap表格内容跑到表格外面的处理办法

    http://stackoverflow.com/questions/21587813/bootstrap-responsive-table-content-wrapping td写下这个样式即可.& ...

  5. Flask备注二(Configurations, Signals)

    Flask备注二(Configuration, Signals) Flask是一个使用python开发Web程序的框架.依赖于Werkzeug提供完整的WSGI支持,以及Jinja2提供templat ...

  6. whoami与who am i

    whoami显示的是当前“操作用户”的用户名,而who am i显示的是“登录用户”的用户名. 若你使用root用户登录,中间su abc切换,whoami的结果是abc,who am i 的结果是r ...

  7. IP地址子网掩码主机地址网络号主机号

    (1)子网掩码1所对应的位为网络号位 而所对应的位为主机号位 IP地址+子网掩码=网络号: IP地址+子网掩码(反码)=主机号. (2)主机号中的m位被用来表示网络号了,也就是子网号,将0-255划分 ...

  8. Android安全开发之WebView中的地雷

    Android安全开发之WebView中的地雷 0X01 About WebView 在Android开发中,经常会使用WebView来实现WEB页面的展示,在Activiry中启动自己的浏览器,或者 ...

  9. zabbix微信告警(虚拟机脚本测试成功,zabbix上收不到信息)

    前言: 使用zabbix直接运行脚本又可以正常接收.但是登录zabbix  web界面,测试!  动作显示已送达,但是微信并没有收到信息! 解决: 添加脚本参数,因为不添加脚本参数,调用不了你这个脚本 ...

  10. 安卓奇葩问题之.so库加载不了

    真是哔了狗了. 今天突然遇到一个问题:之前用第三方的密码控件,给了一个.so库文件.然后我就放在了/jniLibs/armeabi目录下. 运行,一切都很OK. 然后重点来了.N天之后的今天,突然打包 ...