首页 > 代码库 > 运动函数move 各种各样的运动都可以做

运动函数move 各种各样的运动都可以做

2024-08-04 22:02:34   219人阅读

 在这里我说的还是那种匀速运动，主要是通过改变一个盒模形的left值和top 值，来实现运动，或者，改变模形的自身的属性，来动起来：

 

function getStyle(obj,name){	return obj.currentStyle?obj.currentStyle[name]:getComputedStyle(obj,false)[name];};function move(obj,json,options){	options=options||{};	options.time=options.time||700;	var start={};	var dis={};	for(var name in json){		if(name==‘opacity‘){			start[name]=parseFloat(getStyle(obj,name));		}else{			start[name]=parseInt(getStyle(obj,name));		};		dis[name]=json[name]-start[name];	};	var count=Math.round(options.time/30);	var n=0;	clearInterval(obj.timer);	obj.timer=setInterval(function(){		n++;		for(var name in json){			var cur=start[name]+dis[name]*n/count;			if(name==‘opacity‘){				obj.style.opacity=cur;				obj.style.filter=‘alpha(opacity:‘+cur*100+‘)‘;			}else{				obj.style[name]=cur+‘px‘;			}		}	},30);}

　　

getStyle这个函数是获取样式属性的，前面这块已经说过了；

这里要说一下的是动运的公式：

开始的距离+（终点距离-起点距离）*运动了几次/一共能运动多少次；

开始的距离这里用start表示，终点距离用了一个json数据，json[name],就代表是终点距离，n 代表运动了几次，count 代表，30毫秒走一次，一规定的时间里走完这段距离的总次数。


运动函数move 各种各样的运动都可以做


联系
我们