基于javascript的进度条

时间:2010-02-10 20:02:00

标签: javascript jquery progress-bar indicator

我很好奇如何开发基于javascript(或者也受益于jquery)的进度指示器:

alt text http://img707.imageshack.us/img707/3295/dealindicator.png

我的第一个想法是:

function drawBar(total,sofar){
.........................

}

它消耗最大数量(在我们的情况下是20)和sofar(图片为15)。

但是如何实施?

有没有基于jquery的插件来实现这个目标?

此致

1 个答案:

答案 0 :(得分:2)

这通常通过CSS来完成,方法是创建div进度条的总大小,然后再生成另一个div子级,其子宽度需要填充多少。

您可以随意设置div的样式。您可能希望使用background-colorbackground-image& background-repeat。它可以是纯色,渐变色或带状图案,看起来相当受欢迎。

你有Google为jQuery插件吗?它们很容易找到。例如:http://t.wits.sg/jquery-progress-bar/