码迷,mamicode.com
首页 > 编程语言 > 详细

javascript运动的小框架

时间:2017-10-15 21:16:35      阅读:137      评论:0      收藏:0      [点我收藏+]

标签:运动框架

写一个运动小框架

1、需要获取元素对象

document.getElementById();


2、需要在函数里面回去样式值

function Css(obj,attr){
    	if(obj.currentStyle){
 		return obj.currentStyle[arr];
 	}else{
 		return getComputedStyle(obj,false)[arr];
 	}
  }


3、写一个定时器函数

obj.iTmer = setInterval(fn,30);


4、运动函数

function fn(){
    var iTmer = null;
    iSpeed = parseInt(getCss(objDid,‘left‘))>end?-iSpeed:iSpeed;
    obj.iTmer = setInterval(fn,30);
    var dir = null;
    if(arr == ‘opacity‘){
     dir = Math.round(getCss(obj,arr)*100) + iSpeed;
        if ( dir > end && iSpeed > 0 || dir < end && iSpeed < 0) {
        dir = end;
        }
        obj.style[arr] = (dir + iSpeed) / 100;
        obj.style.filter = ‘alpha(opacity=‘+ (dir + iSpeed) +‘)‘;
    }else{
        dir = parseInt(getCss(obj,arr)) + iSpeed;
        if ( dir > end && iSpeed > 0 || dir < end && iSpeed < 0) {
            dir = end;
        }
        obj.style[arr] = dir + ‘px‘; 
    }
    if ( dir == end ) {
        clearInterval( obj.iTmer );
    }
}


javascript运动的小框架

标签:运动框架

原文地址:http://16316333.blog.51cto.com/13108792/1972520

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!