html圆圈特效,HTML5可交互的圆形进度条特效

插件描述：这是一款效果非常炫酷的HTML5可交互的圆形进度条特效。这个圆形进度条由32个圆角矩形组成，用户可以点击每一个圆角矩形将进度条设置到相应的刻度上。它使用js来制作交互动画效果，并带有鼠标滑过时的效果，非常的酷。

制作方法

HTML结构

组成这个圆形进度条的32个圆角矩形每一个实际上是input.radio和的组合。div.barPie__value用于显示当前进度的百分比值。包裹容器中的data-to-value用于圆形进度条的初始值。

0

......

CSS样式

整个圆形进度条设置了固定的宽度和高度，并设置居中显示。.barPie--radio {

margin: 20px;

width: 400px;

height: 400px;

text-align: center;

font: 700 50px 'Open Sans Condensed', sans-serif;

position: absolute;

top: 0;