function animate(obj, target, callback) {
//callback = function(){}
//当我们不断点击按钮 这个元素的速度会越来越快 因为开辟了太多定时器
//解决方案 让我们元素只有一个定时器
//先清除以前的定时器 只保留当前的一个定时器执行
clearInterval(obj.timer)
obj.timer = setInterval(function() {
//步长值写到定时器里面
//把步长值改为整数 不要出现小数
// var step = Math.ceil((target - obj.offsetLeft) / 10)
var step = (target - obj.offsetLeft) / 10;
step = step > 0 ? Math.ceil(step) : Math.floor(step)
if (obj.offsetLeft == target) {
clearInterval(obj.timer)
//回调函数写到定时器里面
if (callback) {
callback()
}
}
//把每次加1 这个步长改成缓慢的效果 公式(目标值-现在的位置)/10
obj.style.left = obj.offsetLeft + step + 'px'
}, 15)
}
作者:森屿灬
链接:https://www.jianshu.com/p/6af484feb52d
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。