循环javascript函数

我有一个脚本可以创建一个进度条，并且是CSS的样式。它工作的很好，但一旦酒吧达到最后，它会停止，我不能让脚本循环，以便它再次启动。如何循环此脚本，以便在进度条到达最后时重新开始进度条？循环javascript函数

<script type="text/javascript"> 
$(document).ready(function() { 
var el = $(''#progress''); 
el.animate({ 
width: "100%" 
}, 40000); 
}); 
</script> 


<style> 
#progressKeeper {background:#f2f2f2;display:none;width: 400px;height: 18px;border: 1px   solid #CCC;-moz-border-radius:7px; border-radius:7px;color:#f2f2f2;font-family:Arial;font- weight:bold;font-style:italic;font-size:.9em;margin-bottom:2000px;} 
#progress {background: #005c9e;width: 0;height: 17px;-moz-border-radius:7px; border- radius:7px;} 
</style>

来源

2013-09-25 user2470781

一两件事，我想尝试是包装脚本中的函数，并且然后循环以一定的条件，如： '为（VAR I = 0; I Guillermo

下降了jQuery，CSS3使用！

#progress { 
    animation:progress 40s linear infinite; 
    -webkit-animation:progress 40s linear infinite; 
} 

@keyframes progress {from {width:0} to {width:100%}} 
@-webkit-keyframes progress {from {width:0} to {width:100%}}

如果你必须支持过时的浏览器......好吧，传递一个回调到animate功能来告诉它再次启动动画。是这样的：

$(function() { 
    var prog = $("#progress"); 
    anim(); 
    function anim() { 
     prog.css({width:0}); 
     prog.animate({width:"100%"},40000,anim); 
    } 
});

来源

2013-09-25 14:12:38

用于浏览器本机方法。 – Kiruse

谢谢@kolink！ – user2470781

使其成为函数并将该函数作为完成处理程序传递给您的.animate调用。请参阅jQuery().animate()。

喜欢的东西：

$(document).ready(function() { 
    function animateProgressBar() { 
     $('#progress').width(0).animate({ 
      width : "100%" 
     }, 40000, animateProgressBar); 
    } 

    animateProgressBar(); 
});

（未经测试）

来源

2013-09-25 14:12:07 Kiruse

循环javascript函数

回答

相关问题