轮播

2017-11-01 本文已影响0人饥人谷_Jack

例如实现4张图片的轮播，让4张图片宽高一样水平排列处于同一个父元素例如ul，把ul的父元素的宽高设为一张图片的宽高，设置overflow=hidden。
在index为-1的位置克隆一张第4张图片，在index为4的位置克隆一张第1你张图片，现在有6张图片此时，此时需要设置ul为相对定位，并且设置left=-一张图片宽度。
当点击下一张按钮时，整个ul往左移动一张图片的宽度，就会显示下一张图片，当显示第6张图片的时候，也就是index=4的时候，重置index=0，把ul的left设置为负的一张图片的宽度。
当点击上一张按钮时，整个ul往右移动一张图片的宽度，就会显示上一张图片，当显示第1张图片的时候，也就是index=-1的时候，重置index=0，把ul的left设置为负的四张图片的宽度。