基于javascript的进度条

发布于 2024-08-20 14:33:40 字数 428 浏览 10 评论 0原文

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

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

我的第一个想法是:

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

}

它消耗最大数量(在我们的例子中为 20)和到目前为止(15 为图片)。

但如何实施呢?

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

问候

I am curious how can a javascript (or also benefiting from jquery) based progress indicator such can be developed:

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

My first idea is something such as:

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

}

where it consumes the max number(20 in our case) and sofar (15 for the picture).

But how can it be implemented?

Is there any jquery based plugin to achieve this?

Regards

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

孤独岁月 2024-08-27 14:33:40

这通常是通过 CSS 完成的,方法是创建一个 div 进度条的总大小,然后再创建另一个 div 子元素,该子元素的百分比宽度为需要的宽度被充满。

您可以根据需要设置 div 的样式。您可能希望使用 background-colorbackground-image & 来设置内部 div 的样式。 背景重复。它可以是纯色的,也可以是渐变的,也可以是带状的图案,这似乎是相当流行的。

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

This is usually done with CSS, by creating a div the total size of your progressbar, and then having another div child of that which has a percentage width of how much needs to be filled.

You can style the divs anyway you want. You likely want to style the inner div with background-color, or background-image & background-repeat. It can be a solid colour, a gradient, or a banded pattern, which seems to be rather popular.

Have you Google'd for jQuery plugins? They are fairly easy to find. Here's one for example: http://t.wits.sg/jquery-progress-bar/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文