javascript 缓冲运动框架的实现


Posted in Javascript onSeptember 29, 2017

javascript 缓冲运动框架的实现

框架的使用,大大的提高了我们的编码的效率,下面分享一个缓冲运动框架。

实例代码:

/**
 * Created by wang on 2016/8/3.
 */

//获取非行间样式和行间样式
function getStyle(obj,name) {
  if(obj.currentStyle){
    return obj.currentStyle[name];
  }
  else {
    return getComputedStyle(obj,false)[name];
  }
}
//获取非行间样式和行间样式

//缓冲运动框架
var timer=null;
function startMove(obj,attr,iTarget) {
  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=(iTarget-cur)/6;
    speed=speed>0?Math.ceil(speed):Math.floor(speed);
    if(cur==iTarget){
      clearInterval(timer);
    }
    else {
      if(attr=='opacity'){
        obj.style.filter='alpha(opcity:'+(cur+speed)+')';
        obj.style.opacity=(cur+speed)/100;
      }
      else {
        obj.style[attr]=cur+speed+'px';
      }
    }
  },30)
}
//缓冲运动框架

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jquery向.ashx文件post中文乱码问题的解决方法
Mar 28 Javascript
javascript动画浅析
Aug 30 Javascript
使用JQUERY进行后台页面布局控制DIV实现左右式
Jan 07 Javascript
jQuery简单图表peity.js使用示例
May 02 Javascript
JS长整型精度问题实例分析
Jan 13 Javascript
javascript中DOM复选框选择用法实例
May 14 Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
May 05 Javascript
AngularJS入门教程之XHR和依赖注入详解
Aug 18 Javascript
JavaScript实现微信红包算法及问题解决方法
Apr 26 Javascript
微信小程序自定义导航栏
Dec 31 Javascript
javascript 高级语法之继承的基本使用方法示例
Nov 11 Javascript
JS实现基本的网页计算器功能示例
Jan 16 Javascript
使用cropper.js裁剪头像的实例代码
Sep 29 #Javascript
详解让sublime text3支持Vue语法高亮显示的示例
Sep 29 #Javascript
微信小程序之页面跳转和参数传递的实现
Sep 29 #Javascript
微信小程序之选项卡的实现方法
Sep 29 #Javascript
vue-cli的eslint相关用法
Sep 29 #Javascript
JavaScript数组的5种迭代方法
Sep 29 #Javascript
微信小程序之GET请求的实例详解
Sep 29 #Javascript
You might like
Php Cookie的一个使用注意点
2008/11/08 PHP
PHP开发注意事项总结
2015/02/04 PHP
PHP反射原理与用法深入分析
2019/09/28 PHP
Laravel框架使用技巧之使用url()全局函数返回前一个页面的地址方法详解
2020/04/06 PHP
jquery判断单个复选框是否被选中的代码
2009/09/03 Javascript
基于jquery实现漂亮的动态信息提示效果
2011/08/02 Javascript
PHPExcel中的一些常用方法汇总
2015/01/23 Javascript
javascript实现验证身份证号的有效性并提示
2015/04/30 Javascript
node.js cookie-parser 中间件介绍
2016/06/06 Javascript
Laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的解决方法
2016/08/18 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
vuejs2.0实现一个简单的分页示例
2017/02/22 Javascript
详解axios 全攻略之基本介绍与使用(GET 与 POST)
2017/09/15 Javascript
使用JS判断移动端手机横竖屏状态
2018/07/30 Javascript
vue-cli安装使用流程步骤详解
2018/11/08 Javascript
使用watch在微信小程序中实现全局状态共享
2019/06/03 Javascript
详解vue项目中实现图片裁剪功能
2019/06/07 Javascript
基于Web Audio API实现音频可视化效果
2020/06/12 Javascript
python改变日志(logging)存放位置的示例
2014/03/27 Python
Python编写登陆接口的方法
2017/07/10 Python
python 从csv读数据到mysql的实例
2018/06/21 Python
PyCharm设置SSH远程调试的方法
2018/07/17 Python
对Python中for复合语句的使用示例讲解
2018/11/01 Python
python消除序列的重复值并保持顺序不变的实例
2018/11/08 Python
详解Python3 基本数据类型
2019/04/19 Python
python如何实现代码检查
2019/06/28 Python
Kears+Opencv实现简单人脸识别
2019/08/28 Python
Flask之pipenv虚拟环境的实现
2019/11/26 Python
django模型类中,null=True,blank=True用法说明
2020/07/09 Python
基于Python-turtle库绘制路飞的草帽骷髅旗、美国队长的盾牌、高达的源码
2021/02/18 Python
Expedia加拿大官方网站:加拿大最大的在线旅游提供商
2017/12/31 全球购物
总经理驾驶员岗位职责
2013/12/04 职场文书
关于中国梦的演讲稿
2014/04/23 职场文书
夏洛特的网观后感
2015/06/15 职场文书
python scrapy简单模拟登录的代码分析
2021/07/21 Python
sql时间段切分实现每隔x分钟出一份高速门架车流量
2022/02/28 SQL Server