Jquery 以不同的时间在表的不同单元格中循环不同的图像

我有一个4行7列的表。在每个td中，我都放置了一个带有三个随机图像的链接（a）（由php创建，没有问题：））。其思想是在每个td中无限地淡入和淡出三个图像。此外，单元之间的循环时间必须不同。图像应该在不同的时间发生变化，而不是所有的图像同时发生变化。 我认为我可以用JQuery实现这个目标，但我一直在网上寻找它，但没有结果。当只有一个循环时，我可以找到解决方案，但是当你同时有这么多不同的循环时，你怎么能找到它呢

HTML:

我明白了！！！ 我只是在表格后面插入了这个代码

var min=3000;
            var max=8000;
            var transMult=0.4;
            var currIdx = new Array(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0);
            var i=0;
            function animateBG(i) {
                    currIdx[i]=(currIdx[i] < 2) ? currIdx[i] +1 : 0;
                    displayTime=Math.random()*(max-min)+min;
                    setTimeout(function() {
                        transitionTime=Math.floor(displayTime*transMult);
                        $("td a").eq(i).children("img").css('z-index',1);
                        $("td a").eq(i).children("img").eq(currIdx[i]).css('z-index', 2).fadeIn(transitionTime, function() {
                        $("td a").eq(i).children("img").not(this).hide();
                        animateBG(i);
                        });
                    }, displayTime)
            }
            $(window).load(function()
                {
                    for(j=0;j<24;j++)
                    {
                        animateBG(j);
                    }
               });

var最小值=3000；
var max=8000；
var transMult=0.4；
var currIdx=新数组（0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0）；
var i=0；
EBG函数（i）{
currIdx[i]=（currIdx[i]<2）？currIdx[i]+1:0；
displayTime=Math.random（）*（max-min）+min；
setTimeout（函数（）{
transitionTime=数学地板（显示时间*传输结果）；
$（“td a”）.eq（i）.儿童（“img”）.css（'z指数'，1）；
$（“td a”）.eq（i）.children（“img”）.eq（currIdx[i]）.css（'z-index'，2.）.fadeIn（transitionTime，function（）{
$（“td a”）.eq（i）.children（“img”）.not（this.hide（）；
ebg（i）；
});
}，显示时间）
}
$（窗口）。加载（函数（）
{
对于（j=0；j
a.casella {position:relative;} 
a.casella img{position: absolute; left:0; top:0; display:none; z-index:-1; width:120px; height:120px}

var min=3000;
            var max=8000;
            var transMult=0.4;
            var currIdx = new Array(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0);
            var i=0;
            function animateBG(i) {
                    currIdx[i]=(currIdx[i] < 2) ? currIdx[i] +1 : 0;
                    displayTime=Math.random()*(max-min)+min;
                    setTimeout(function() {
                        transitionTime=Math.floor(displayTime*transMult);
                        $("td a").eq(i).children("img").css('z-index',1);
                        $("td a").eq(i).children("img").eq(currIdx[i]).css('z-index', 2).fadeIn(transitionTime, function() {
                        $("td a").eq(i).children("img").not(this).hide();
                        animateBG(i);
                        });
                    }, displayTime)
            }
            $(window).load(function()
                {
                    for(j=0;j<24;j++)
                    {
                        animateBG(j);
                    }
               });