轮播图详细代码
这里面我封装了一个animate.js这个js代码主要实现的是ul的移动, 按钮事件处理函数中的代码(让一个元素,从左往右,或者从右往左缓慢移动) （ 可参考之前写的简单动画案例 ） animate.js代码 //封装 按钮事件处理函数中的代码(让一个元素,从左往右,或者从右往左缓慢移动) /* * 作用: 让一个元素,从左往右,或者从右往左缓慢移动 * element: 要求传入一个元素 元素 * target : 元素移动的目标位置 数字 * step: 步进(每次元素移动的距离) * callback : 回调函数 到达目标位置之后,会被调用 * */ function animate(element, target, step, callback){ // 清除定时器 if(element.timeid){ clearInterval(element.timeid); } // 1. 设置定时器 element.timeid = setInterval(function(){ // 2. 获取元素的当前位置 var current = element.offsetLeft; // 3. 根据当前位置加上/减去我们的步进 // 如果当前位置大于目标位置,就是减去步进.否则就是加上步进 if(current > target){ // 证明是从右往左,应该减去step var