Question

我想继续循环浏览一些图像。我已经使用下面的代码循环回到第一个图像（以便它继续），但它不起作用。相反，它停在最后一张图片上：

<div class="slider">
    <img id="1" src="IMG_20150118_104517.jpg"  alt="joselyd">
    <img id="2" src="IMG_20150208_080200.jpg"  alt="adom">
    <img id="3" src="IMG_20150211_104625.jpg"  alt="drbill">
    <img id="4" src="150311-104338.jpg" alt="tonado">
    <img id="5" src="ha1.jpg" alt="haj">
    <img id="6" src="IMG_20150211_104620.jpg"  alt="mog">
</div>

CSS

.slider {width: 550px; height:270px;
overflow:hidden; margin:30px auto;
background-image:url('loader_gif.gif');
}
.slider img {
width: 550px; height:270px; display:none;
border="0"
}

JQUERY

function slider() {
    $(".slider #1").show("fade",500);
    $(".slider #1").delay(5000).hide("slide",{direction:'left'},500);

    var sc=$("slider img").size();
    var count= 2;


    setInterval(function(){
    $(".slider #"+count).show("slide",{direction:'right'},500);
    $(".slider #"+count).delay(5000).hide("slide",{direction:'left'},500);

    if(count == sc)
     {count = 1;}
    else
     {
    count=count+1;
    }

    },6000);
}

Answer 1

只需替换此行

var sc=$("slider img").size();

用这个

var sc=$(".slider img").size();

这里的小提琴链接：https://jsfiddle.net/88u56y9h/

使用jQuery循环遍历图像

1 个答案: