1，效果图
https://ga20.github.io/slider/
2，原理图
分三步：
将视口元素设置overflow:hidden
将其图片子元素设置float:left
让橙色的框（包裹）滑动起来
3，具体细节
写出滑动函数，通过图片索引值的差来判断左滑还是右滑，索引值的差*图片宽度等于滑动距离
4，遇到的问题
当前页面失去焦点之后，浏览器会缓存动画，但是setInterval会继续执行，导致过一会切回页面的时候动画混乱
具体做法是：
通过window的onblur和onfocus来改变一个标志，来控制自动滑动函数的执行
源码：https://github.com/ga20/slider
转载请注明出处，谢谢