如何使用jQuery和setTimeout更改图像?

时间:2014-06-02 12:24:29

标签: jquery settimeout

我想在jQuery中使用setTimeout更改图像。我尝试了这个,但没有得到答案。我的意思是图像不会改变。请帮忙......

$(document).ready(function(){
    $("ul li") .each(function(){
        thisdisplay = $(this).css("display");
        if (thisdisplay == 'block') {
            setTimeout(function() {
                $(this).fadeOut(function() {
                    $(this).next().fadeIn().css("display", "block");
                });
            }, 500);
        }
    });
});

和html:

   <ul>
     <li id="li1" class="showed"><img src="images/img1.jpg" alt="" /></li>
     <li id="li2"><img src="images/img2.jpg" alt="" /></li>
     <li id="li3"><img src="images/img3.jpg" alt="" /></li>
     <li id="li4"><img src="images/img4.jpg" alt="" /></li>
   </ul>

和css:

ul li {display:none;}
.showed {display:block;}

1 个答案:

答案 0 :(得分:0)

选中此Fiddle是您问题的解决方案 您需要的所有jQuery代码都是

<script type="text/javascript">
$(document).ready(function(){
        var count=0
        setInterval(function() {
            $('li img').hide()
            if(count===4){count=0}
               count++
               $('#li'+count).find('img').show()

            }, 500);

})
</script>