首页 > 其他 > 详细

运动框架

时间:2015-04-25 19:40:24      阅读:215      评论:0      收藏:0      [点我收藏+]

function getStyle(obj, attr){
 if(obj.currentStyle){
  return obj.currentStyle[attr];
 }
 else{
  return getComputedStyle(obj, false)[attr];
 }
}//获取样式

function startMove(obj, json, fn){
/*obj 进行运动的节点
 
json 要进行哪些运动 如:{width:300,height:200}{opacity:100} 300 、200为目标点
 
fu 运动结束后进行的 操作 如 :运动结束后出现一个弹窗什么的*/

clearInterval(obj.timer);
 obj.timer=setInterval(function (){
  var bStop=true;  //这一次运动就结束了――所有的值都到达了
  for(var attr in json) {
 var iCur=0;//1.取当前的值
     if(attr==‘opacity‘){
    iCur=parseInt(parseFloat(getStyle(obj, attr))*100);
   }
   else{
    iCur=parseInt(getStyle(obj, attr));
   }
   //2.算速度
   var iSpeed=(json[attr]-iCur)/8;
   iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);
   //3.检测停止
   if(iCur!=json[attr]){
    bStop=false;
   }
   if(attr==‘opacity‘){
    obj.style.filter=‘alpha(opacity:‘+(iCur+iSpeed)+‘)‘;
    obj.style.opacity=(iCur+iSpeed)/100;
   }
   else{
    obj.style[attr]=iCur+iSpeed+‘px‘;
   }
  }
  if(bStop)
  {
   clearInterval(obj.timer);
   if(fn){
    fn();
   }
  }
 }, 30)
}

运动框架

原文:http://www.cnblogs.com/pcd12321/p/4456368.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!