FadeIn FadeOut with Loop

时间:2013-11-26 18:35:43

标签: jquery loops fadein fadeout

我想循环以下代码。我搜索了但我没有找到解决方案。有人能帮助我吗?

<script>


$(function(){
$('img#picture').fadeIn('slow');

setTimeout(function(){ 
  $('#test').fadeIn("slow"); 
 }, 2000 ); 

setTimeout(function(){ 
 $('#test').fadeOut("slow"); 
 }, 10000 ); 


})

</script>

非常感谢。

祝你好运

2 个答案:

答案 0 :(得分:1)

感谢您向我展示该网站,请试试这个:

<script>
$(function(){

    $('img#jana, img#katharina, img#kathrin').fadeIn('slow', function () {

        setTimeout(showNext, 2000);

        setInterval(showNext, 10000);

    });

    function showNext() {
        var target = $('#expertenbilder');

        if (target.find('#sprechblase_jana').is(':visible')) {
            $(this).fadeOut("slow");

            setTimeout(function () {
                target.find('#sprechblase_katharina').fadeIn("slow");
            }, 2000);
        } else if (target.find('#sprechblase_katharina').is(':visible')) {
            $(this).fadeOut("slow");

            setTimeout(function () {
                target.find('#sprechblase_kathrin').fadeIn("slow");
            }, 2000);
        } else if (target.find('#sprechblase_kathrin').is(':visible')) {
            $(this).fadeOut("slow");

            setTimeout(function () {
                target.find('#sprechblase_jana').fadeIn("slow");
            }, 2000);
        } else {
            $('#sprechblase_jana').fadeIn("slow");
        }
    }

});
</script>

答案 1 :(得分:1)

使用setInterval

var t=setInterval(function(){

$('img#picture').fadeIn('slow');

setTimeout(function(){ 
 $('#test').fadeIn("slow"); 
}, 2000 ); 

setTimeout(function(){ 

  $('#test').fadeOut("slow"); 
}, 10000 ); 

},3000)  //3000 is just an example, set suitable interval to allow effect to run smoothly 


window.clearInterval(t)  //to stop