代码之家 › 专栏 › 技术社区 › Traveling Tech Guy

如何更改一个进度条的颜色/大小

progress-bar jquery-ui

Traveling Tech Guy · 技术社区 · 17 年前

我对jQueryUI相当陌生,但我喜欢迄今为止看到的东西。

我使用的是“闪电战”主题(因为我需要红色进度条),我有4个进度条并排在一个页面上。现在我的首相希望其中一个是绿色的,比其他的都大。我查看了提供的主题CSS,但找不到合适的标签进行修补。任何人都可以发布一个由两个不同大小/颜色的进度条并排组成的简短代码吗?

额外问题:我被要求打印PB在PB中的百分比-没什么大不了的-我只是在div中添加了一个标签。问题是标签中的文本是白色的,所以如果PB是空的或半空的,文本将不可见。有没有办法控制PB的背景色,或者它是一个给定的主题?

男人

2 回复 | 直到 15 年前

Tyler Carter 17 年前

这是如何设置栏的,因此请修改其中的类。

<div class="ui-progressbar ui-widget ui-widget-content ui-corner-all">
   <div style="width: 37%;" class="ui-progressbar-value ui-widget-header ui-corner-left"></div>
</div>

(Its at the bottom of the badge)

ui-progressbar 和 ui-progressbar-value .

Robert Harvey 17 年前

旅行技术员:

如果你在下载的jQueryUI的css文件夹中查找,你会发现一个主题文件夹;我的名字叫ui lightness,你的名字可能叫ui blitzer。进入该文件夹,然后进入图像文件夹。在那里,您将找到一些以字母开头的图像文件 ui-bg_diagonals 和 ui-bg_gloss . 这些是驱动进度条的图像。你应该能够从另一个主题中添加一些你想要的颜色的图像,这将驱动你的其他状态栏。

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Nuñito Calzada · JQuery在spring boot和Thymelaf中从DB自动完成

2 年前

Connor · 使用jquery UI幻灯片制作周围动画

2 年前

provance · 如何获得最新版本的jquery ui?

2 年前

Akhilesh · 当数据目标中有分号或冒号时,带有展开的aria的Button元素不展开

3 年前

chris loughnane · 使用jQuery UI滑块移动和缩放svg元素时遇到问题?

8 年前

Tirkesh Turkesh · 如何在可拖放div中释放项目的精确位置元素上拖放

8 年前

ferralucho · Hightlight jquery datepicker标头选定的星期几

8 年前

Paili · 如何在jQuery自动完成中添加其他内容?

8 年前

monu · 动态嵌套选项卡创建

8 年前