0

嗨，我为原型滑块使用了一些代码，但代码不起作用。我的第一个图像第一次执行总没有比其他图像开始滑动。如果有 3 个图像比第一个图像滑动 3 次并且滑块开始工作. 这是我的代码：

var i = 0;
var j=0;
var time = '';
var delay ='';
var item_id ='';



var child;
var image_slide = [];
var NumOfImages;    
var wait = 2000;        
      var container = document.getElementById("image-container");

    for (child = container.firstChild; child; child = child.nextSibling) {
        if (child.id && child.nodeName === "DIV") {
        image_slide.push(child.id);
        }
    }

    var NumOfImages = image_slide.length;

function SwapImage(x,y) {
    console.log(x);
    $(image_slide[x]).appear({ duration: 1.5 });
    $(image_slide[y]).fade({duration: 1.5});
}


function StartSlideShow() {
    play = setInterval('Play()',wait);


}

function Play() {
    var imageShow, imageHide;

    imageShow = i+1;
    imageHide = i;

    if (imageShow == NumOfImages) {
        SwapImage(0,imageHide); 
        i = 0;                  
    } else {
        SwapImage(i+1,imageHide);           
        i++;
    }
}

function Stop () {
    clearInterval(play);                

}.

这是我的html

<div id="image-container"  class="protoshow"  onmouseover="javascript:StartSlideShow();" onmouseout="javascript:Stop();">

                <div class="fade-box" id="image-1"><img src="slide01.jpg" alt="" /></div>
                <div class="fade-box" id="image-2"><img src="slide01.jpg"  alt="" /></div>
                <div class="fade-box" id="image-3"><img src="slide01.jpg"  alt="" /></div>
                <div class="fade-box" id="image-4"><img  ssrc="slide01.jpg"  alt="" /></div>

        </div>

我尽力而为，但不知道为什么会发生。在此先感谢

4

1 回答 1

0

在调试每一行之后，我发现在第一个循环中它隐藏了所有具有 css 的 display:none 属性的较低元素。在将 dispaly:none 添加到除第一个以外的每个元素之后，它会在第一个循环中自动更改元素。所以当使用自定义滑块时除了第一个元素之外，其他元素必须不显示滑块效果。谢谢

于 2012-12-20T07:30:56.743 回答