顺利动画javascript堆叠进度条没有闪烁

Question

有什么方法可以让堆叠的进度条平滑地动画而不会闪烁？

我目前正在使用Bootstrap，更改宽度样式（使用Knockout）。 示例：https://jsbin.com/lewuzewupo/2/edit?html,console,output 我的问题是，如果你看得那么长，右边的绿色条纹就会闪烁。这似乎是因为当中间的深蓝色条出现并消失时，动画会导致它被推向右侧。

（我已经尝试了所有我能想到的事情，以确保在任何时候，堆积条的总数超过100.如果我停止使用进度条类并使用我自己的类似外观，但没有动画，则没有闪烁，条纹稳定，总是100个。）

那么Bootstrap中是否存在解决问题的方法，或者创建堆栈进度条的另一种方法，它看起来像Bootstrap一样漂亮并且能够流畅地制作动画？

[编辑：添加调试以证明我的百分比总是100]

Answer 1

我认为我之前遇到过这种事情 - 它归结为“完成”这样的事情。文本。基本上它没有正确地计算出宽度。 2个想法。

1. 删除＆＃39;完成＆＃39;文字，应该没问题。

2. 尝试仅在一段时间后显示完整且值已降至特定比率。

抱歉，不能提供更多帮助。