数据百分比属性更改的CSS转换

Question

我找到了一个代码，它创建了一个循环进度条，并且稍微改了一下，从1到另一个数字点击增长。后来我想添加转换，但它似乎不起作用，进度条在没有转换的情况下更改

-moz-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;

http://jsfiddle.net/Aapn8/8362/

有人知道如何进行过渡工作吗？

Answer 1

你的drawCircle函数使用canvas并且不受CSS的影响。 CSS仅适用于html标签，而不适用于画布上的线条。

来自WIKI的引用：“层叠样式表（CSS）是一种样式表语言，用于描述文档的表示用标记语言编写 ”

https://en.wikipedia.org/wiki/Cascading_Style_Sheets

Answer 2

正如@ user1850903所写 - 转换不起作用。

您可以使用setInterval()来获得所需的效果：

http://jsfiddle.net/3j0vxx77/17/