javascript - Twitter-Bootstrap 进度条每 x 秒 100%

Question

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

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

进度条是通过宽度样式填充的，所以上面会将它放在 40% 完成

我怎样才能让它在 5 秒内顺利加载到 100%，然后重置回 0 并重新开始，重复？

谢谢。

Answer 1

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

为此，我使用complete函数的参数animate。
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();
}