Отображение значков jquery themeroller в цветах

Question

H все,

Я использую значок предупреждения jquery themeroller. Я хочу, чтобы этот значок отображался разными цветами. Например, отображать этот значок красным цветом в сообщении об ошибке и желтым цветом для предупреждающего сообщения. Ниже приведен значок по умолчанию.

<span class="ui-icon ui-icon-alert"></span>

Можно ли добавить цвета к иконкам Jquery?

Answer 1

Вы можете изменить цвет иконки и почти все остальное, используя тематический ролик так:

http://tinyurl.com/cjdquub

Answer 2

Вы можете создать свой стилизованный набор иконок с помощью тематического ролика или другого программного обеспечения, а затем указать другой URL-адрес фонового изображения для другого класса CSS в соответствии с вашими потребностями.

Например:

red color <span class="ui-icon ui-icon-alert red"></span>
<br><br>
blue color <span class="ui-icon ui-icon-alert blue"></span>

Css:

.ui-icon.red { background-image: url(http://code.jquery.com/ui/1.9.1/themes/base//images/ui-icons_cd0a0a_256x240.png); }
.ui-icon.blue { background-image: url(http://rhizosphere.googlecode.com/hg-history/e546f1a44825e2e1568de9d5bb87d3f2b1f41acd/src/stylesheets/blue/images/ui-icons_6391de_256x240.png); }

Таким образом, ядро ​​jQuery UI css такое же, вы просто переопределяете определенный атрибут.

Вот рабочая скрипка: http://jsfiddle.net/rrbn3/