js轮播时的动画效果函数封装

在这里需要先在轮播里计算好要移动的像素target,和移动的元素box,调用函数传参即可.

function getLeft(target, box) {
            var long = 15;
            var currleft = box.offsetLeft; //获取元素左边距
            if (target == currleft) {
                return;
            } //如果相等则不动
            long = target > currleft ? Math.abs(long) : -1 * Math.abs(long) //判断向左或向右
            clearInterval(temp) //再次点击清除上一次的定时器
            temp = setInterval(function() {
                var left = box.offsetLeft;
                left += long; //每一次距离左边的距离
                box.style.left = left + 'px';
                var cha = target - left; //判断是否为最后一次移动,如果是则不用移动,直接移到最后,并清除移动效果
                if (Math.abs(cha) < Math.abs(long)) {
                    box.style.left = target + 'px';
                    clearInterval(temp);
                }
            }, 16.7)
        }