var imgs = document.getElementsByTagName("img");var btns = document.getElementsByTagName("span");var ul = document.getElementsByTagName("ul");var lis = document.getElementsByTagName("li");var len = imgs.length;var current =0;let flag =true;var timer;functionwrapper(){frount();bind();getLi();btnClick();showLis();autoplay();};wrapper();// 图片移动functionfrount(){var mlen = Math.floor(len /2);var limg, rimg;for(var i =0; i < mlen; i++){
limg = len + current - i -1;
rimg = current + i +1;if(limg >= len){
limg -= len;}if(rimg >= len){
rimg -= len;}
imgs[limg].style.transform =`translateX(`+(150)*(i +1)+`px) translateZ(`+(200- i *100)+`px) rotateY(-30deg)`;
imgs[rimg].style.transform =`translateX(`+(-150)*(i +1)+`px) translateZ(`+(200- i *100)+`px) rotateY(30deg)`;}
imgs[current].style.transform =`translateZ(300px)`;};// 点击图片functionbind(){for(var i =0; i < len; i++){(function(i){
imgs[i].onclick=function(){
current = i;frount();autoLi();}})(i);
imgs[i].onmouseenter=function(){clearInterval(timer);}
imgs[i].onmouseout=function(){autoplay();}}};// 自动更换图片functionautoplay(){
timer =setInterval(function(){if(current >= len -1){
current =0;}else{
current++;}frount();autoLi();},2000)}// 点击左右按钮functionbtnClick(){for(var i =0; i < btns.length; i++){(function(i){
btns[i].onclick=function(){if(!flag){return;}
flag =false;// 左按钮if(i==0){if(current <=0){
current = len -1;}else{
current--;}}// 右按钮if(i==1){if(current >= len -1){
current =0;}else{
current++;}}setTimeout(()=>{
flag =true;},800);frount();autoLi();}})(i);
btns[i].onmouseenter=function(){clearInterval(timer);}
btns[i].onmouseout=function(){autoplay();}}};// 点击小圆圈functiongetLi(){for(var i =0; i < len; i++){(function(i){
ul[0].innerHTML +="<li></li>"})(i);}
lis[0].classList.add("current")}functionshowLis(){for(var i =0; i < len; i++){(function(i){
lis[i].onclick=function(){// 排他思想for(var k =0; k < len; k++){
lis[k].classList.remove("current")}this.classList.add("current")
current = i;frount();}})(i);
lis[i].onmouseenter=function(){clearInterval(timer);}
lis[i].onmouseout=function(){autoplay();}}}functionautoLi(){for(var i =0; i < len; i++){if(i == current){
lis[i].classList.add("current")}else{
lis[i].className ='';}}}