html轮播图每次轮播回到开头,使用JS实现图片轮播的实例(前后首尾相接)

最近各种跑面试，终于还是被问到这个，一脑子浆糊，当时没想出来首尾相接怎么搞，回来之后研究了一波，终于搞出来了，不多说，直接看代码

代码参考了一位已经写好了图片轮播功能的(再次表示感谢)，但是没有首尾相接的功能，本人在此基础上增加了首尾相接功能。

效果如下：

图片轮播

body,div,ul,li,a,img{margin: 0;padding: 0;}

ul,li{list-style: none;}

a{text-decoration: none;}

#wrapper{

position: relative;

margin: 30px auto; /* 上下边距30px，水平居中 */

width: 400px;

height: 200px;

}

#banner{

position:relative;

width: 400px;

height: 200px;

overflow: hidden;

}

.imgList{

position:relative;

width:2000px;

height:200px;

z-index: 10;

overflow: hidden;

<