打印进度条的百分比动画时

我开发一个进度条，它的HTML看起来像这样打印进度条的百分比动画时

<div class="progressbar"><div class="text">%0 Completed</div> 
      <div class="progressbar_inner"></div> 
     </div>

，并使用这个jQuery代码吧：

$(".progressbar_inner").animate({ 
       width:"20%" 
      },100,function(){ 
       $(".text").html("%20 Completed"); 
       });

我的问题是：我要打印动画开始和结束时进度条的百分比。像这样：％1已完成％2已完成等。任何人都可以帮助我吗？

来源

2013-03-29 user2854865

而不是使用动画的，写自己的方法循环，并增加1宽度％使用'$（elem）.css（'width'，iterator +'％'）'。在每次迭代中，还将$（“。text”）。html（）设置为您的迭代器值。 – Danwilliger

你的意思是我必须写一个函数，包括称为“迭代器”或另一个？ – user2854865

您可以使用步选项动画功能的：

$(".progressbar_inner").animate(
    {width:"50%"}, 
    {duration: 1000, 
    step: function(current_number){ 
     $(".text").html(Math.floor(current_number) + "% Completed"); 
    } 
    } 
);

见行动：http://jsfiddle.net/willemvb/JRqVw/

来源

2013-03-29 16:28:46

这工作！非常感谢威廉 – user2854865

打印进度条的百分比动画时

回答

相关问题