Twitter-Bootstrap 进度条每 x 秒 100%答案

【问题标题】：Twitter-Bootstrap progress bar 100% every x amount of secondsTwitter-Bootstrap 进度条每 x 秒 100%
【发布时间】：2012-10-27 21:30:19
【问题描述】：

是否可以让 Bootstrap 进度条每隔 5 秒达到 100%

    <div class="progress progress-striped active">
      <div class="bar" style="width: 40%;"></div>
        </div>

进度条是通过宽度样式填充的，所以上面会显示完成 40%

如何让它在 5 秒内顺利加载到 100%，然后重置回 0 并重新开始，重复？

谢谢。

【问题讨论】：

也许这是您正在寻找的东西？ jsfiddle.net/xXM2z
或者这个jsfiddle.net/xXM2z/489?
感谢您的回复，正是我需要的，每次都需要重复它达到 100%！

标签： javascript css twitter-bootstrap

【解决方案1】：

在这个答案中，我稍微修改了@Blender 的方法以永久运行。

为此，我使用 animate 函数的 complete 参数。
http://jsfiddle.net/xXM2z/490/
完整的 JS 代码：

$(document).ready(function(){
   animateScroll();
});

function animateScroll()
    {
    $('.bar').animate({
    width: '100%'
}, {
    duration: 5000,
    easing: 'linear',
    complete:function(){ $(this).css("width","0%");
   }
});
animateScroll();
}

【讨论】：