进度条与进度文本在指定时间内更改

时间:2016-03-21 15:36:50

标签: javascript jquery css css-transitions

我在使用进度文本编程进度条时遇到问题。考虑这种情况。

我有一个名为#bar的条形height。在改变其称为percent的内部值时,它应该从0到100%成比例地上升。它在指定的时间间隔(即1秒)内通过css转换引发。所以我在一秒钟内将高度从0改为100px。我还想更改描述进度的值,以便它在条50上写入,如果它有50%的进度,依此类推。

我开始通过setTimeoutsetInterval进行此操作,每次迭代也会增加进度条的高度并更新进度文本(如1,2,3 ... 100)。不幸的是,如果我将间隔时间设置为1毫秒,则进度条会在超过100毫秒的时间后以100px结束。这就是我选择过渡的原因,因为它会持续一段时间。问题是我不知道如何在动画期间将进度文本值更改为适当的值。你有什么建议吗?

0 个答案:

没有答案