CSS转换计数器?

时间:2012-12-30 21:47:06

标签: css css-transitions

我在页面上有各种进度条。目前我的栏位受transition影响,因此当进度发生变化时,它会顺利移动到新值。

该栏还包含其进度,以百分比表示。

我面临的“问题”是,当条形宽度过渡时,显示的数字会从一个值跳到另一个值,所以我想知道CSS是否有任何方法可以“转换”该数字。

我能想到的唯一解决方案是使用

counter-reset: tmpcounter 50;
content: counter(tmpcounter);
transition: counter-reset 0.5s ease;

当然,这不起作用。即使它确实如此,它只适用于伪元素,因此当值发生变化时,我无法用JavaScript修改它。

我错过了什么,或者只是不值得为此担心?

1 个答案:

答案 0 :(得分:1)

我不确定我是否理解跳数的问题。但这个例子是Thermometer-like progress bar帮助吗?