Javascript 图像滑块转换未正确循环返回

我试图制作一个图像滑块，在几秒钟内过渡到一个新图像。然而，由于某种原因，它没有回到最初的画面，似乎试图笨拙地过渡。这里是代码其余部分的链接

var i=0//标题
var size=0//image
var=4000；
函数imgTransition（）{
var transit=document.getElementsByTagName（“img”）
对于（变量i=0；i

以下是我对您的代码所做的一些更改：

首先，当我为图像索引添加

imgind

时，我对您的

global

变量进行了更改，

transit

对于图像采集，然后我在

load

事件中分配

transit

和

size

变量，这样您就不必在代码中一次又一次地分配它们，然后我在

load

事件中注释了函数

titlettransition（）

调用，因为它没有声明（您稍后可能会使用）并将第一幅图像的

不透明度设置为1，因为它将首先显示，然后称为
设置间隔（imgTransition，fade）；
而不是
imgTransition（）
，这样设置的间隔与代码分开，而不是自己调用

下面看一下这个修改后的代码段：

片段


var i=0；//标题
var-imgind=0；
var size=0//image
var时间=3000；
var=4000；
var transit=null；
函数imgTransition（）{
transit[imgind].style.opacity=0；//隐藏索引图像
imgind++；//增加图像索引
if（imgind>=size）//检查索引是否大于或等于size
imgind=0；//将索引设置为第一个图像，即0。
transit[imgind].style.opacity=1；//显示下一幅图像
}
window.onload=函数（）{
transit=document.getElementsByTagName（“img”）；//获取图像集合
size=transit.length；//获取图像的大小
transit[imgind].style.opacity=1；//设置第一幅图像的不透明度
设置间隔（img转换、淡入淡出）；
//titletTransition（）；//未定义的函数
}；
img{
过渡：全部。5秒轻松；
左：160像素；
位置：绝对位置；
宽度：30%；
身高：50%；
保证金：0；
填充：0；
不透明度：0；
}


var i = 0; //title
var size = 0 //image
var fade = 4000;

function imgTransition() {
   var transit = document.getElementsByTagName("img")
   for(var i= 0; i < transit.length - 1; i++) {
       transit[size].style.opacity = 0;
   }
   if (size < transit.length - 1) {
      size++;
      transit[size].style.opacity = 1;
   }
   else {
      size = 0;
      transit[size].style.opacity = 1;
   }
   setInterval('imgTransition()', fade);
}

window.onload = function() {
   imgTransition();
};