当前位置: 代码迷 >> 综合 >> JS链式运动框架---move.js
  详细解决方案

JS链式运动框架---move.js

热度:69   发布时间:2023-12-06 23:29:19.0
//startMove(obj,{attr1:itarget1,attr2:itarget2},fn)---JSON格式fucntion startMove(obj,json,fn){
     //fn——回调函数 var falg = true;//假设所有的目标值都到达了 clearInterval(obj.timer); obj.timer = setInterval(function(){
      for(var attr in json){
     //1)获取当前的值 var icur = 0; if(attr == "opacity"){
      //parseFloat返回小数值 //由于计算机存储小数有误差,采用Math.round()四舍五入得整数 icur = Math.round(parseFloat(getStyle(obj,attr))*100); }else{
      icur = parseInt(getStyle(obj,attr)); } //2)计算速度var speed = (json[attr] - icur)/10; speed = speed>0?Math.ceil(speed):Math.floor(speed); //3)判断运动是否结束 ,检测停止 //只能判断到一个目标值达到,就停止检测了。if(icur != json[attr]){
      //假设有目标值没有到达flag = false; }if(attr == "opacity"){
      icur += speed; obj.style.filter = "alpha(opacity:"+ icur +")"; obj.style.opacity = icur/100; }else{
      obj.style[attr] = icur + speed + "px"; } }if(flag){
     //flag=true,所有的目标值都到达clearInterval(obj.timer);if(fn){
     fn();}}},30); } //获取属性值  function getStyle(obj,attr){
      if(obj.currentStyle){
      //兼容IE浏览器 return obj.currentStyle[attr]; }else{
      //兼容firefox浏览器 return getComputedStyle(obj,false)[attr]; } } 


  相关解决方案