javascript - 如何停止下面提到的 jQuery 15 秒后的淡入淡出和滑动？现在它正在无限地进行

Question

此横幅有动画，需要 3 秒才能完成动画。我想要 5 个循环后停止此 3 秒循环。你能帮我吗 相同？我尝试了 for 循环和 if 语句但无法实现我的目标

function showBanner(){    
  $(".banner").fadeIn("slow", function(){  
    $("h1").slideDown("slow", function(){   
      $("h2").slideDown("slow", function(){ 
        $(".logo").fadeIn("slow", function(){  
          setTimeout(hideBanner, 3000);  
        }); 
      });   
    });
  });
}

function hideBanner(){
  $(".logo").fadeOut("slow", function(){
    $("h2").slideUp("slow", function(){
      $("h1").slideUp("slow", function(){
        $(".banner").fadeOut("fast", function(){
          showBanner();
        });
      });
    });
  });
}

showBanner();

Answer 1

可以使用外部函数:

function banner(loops){    
    function showBanner(){    
        $(".banner").fadeIn("slow", function(){  
            $("h1").slideDown("slow", function(){   
                $("h2").slideDown("slow", function(){ 
                    $(".logo").fadeIn("slow", function(){  
                        setTimeout(hideBanner, 3000);  
                    }); 
                });   
            });
        });
    }

    function hideBanner(){
        $(".logo").fadeOut("slow", function(){
            $("h2").slideUp("slow", function(){
                $("h1").slideUp("slow", function(){
                    $(".banner").fadeOut("fast", function(){
                        --loops && showBanner();
                    });
                });
            });
        });
    }
}

banner(5);