运动函数:move()

/*
		 
		 * //obj:对象 ;attr:属性 dir:步长 target:终点目标 endFn:回调函数
		 * move(obj, "attr", dir, target, endFn//function(){回调执行事件})
		 * 注释*1
		 * obj.onOff
		 * 防止定时器插队
		 * 当函数执行时该值将成为不可执行值
		 * 知道定时器执行完成后改变该值
		 * 
		 * 注释*2
		 * 回调函数
		 * 判断当前函数是否存在
		 * 如果存在就执行
		 * */

function move(obj, attr, dir, target, endFn) {
	var dir = parseInt(getStyle(obj, attr)) < target ? dir : -dir //判断正负:三元表达式
	if(!obj.onOff) { //注释*1
		obj.onOff = true

		timer = setInterval(function() {
			var speed = parseInt(getStyle(obj, attr)) + dir; //步长
			if(speed > target && dir > 0 || speed < target && dir < 0) { //判断方向
				speed = target;
			}
			obj.style[attr] = speed + "px"; //执行当前函数要求
			if(speed == target) { //判断当前事件是否已经完成
				clearInterval(timer); //已经完成,清除定时器
				//console.log(parseInt(getStyle(obj, attr)))  数据检查
				obj.onOff = false //注释*1
				if(endFn) { //注释*2
					endFn();
				}
			}
		}, 15)
	}
}

function getStyle(obj, attr) { //getStyle()  获取元素当前属性值
	return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj)[attr]
}

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值