//封装动画函数
function animate(obj, target, callback) { //ojb代表元素对象 target代表结束的时间 callback回调函数
//先清除以前的定时器,只保留当前一个定时器执行
clearInterval(obj.time);
obj.time = setInterval(function () {
//1.步长写在定时器里面
//2.把我们的步长改为整数,不要出现小数的问题。
//3.缓动算法:(目标值-现在的位置)/10
var step = (target - obj.offsetLeft) / 10;
step = step > 0 ? Math.ceil(step) : Math.floor(step);
if (obj.offsetLeft == target) {
clearInterval(obj.time);
//回调函数写到定时器结束里面
if (callback) {
//调用函数
callback();
}
}
obj.style.left = obj.offsetLeft + step + 'px';
}, 20)
}
js封装动画
最新推荐文章于 2024-07-12 14:10:05 发布