我可以设置一个jQueryUI按钮的自定义图标

Question

是否有可能创建一个带有自定义图标的jQueryUI按钮，即：图标不是随jQueryUI提供的精灵图标的一部分？

我使用了一组3个复选框的ButtonSet功能，但需要比什么提供开箱即用的更程式化图标...

Answer 1

工作了一个CSS破解。

设置按钮按正常，得到伯图标下方

.Error 
{ 
    background-image: url('Images/Icons/16/Error.png') !important; 
} 

该！重要覆盖的UI的图标定义定义背景图像的“错误”级。

Answer 2

我采取这种做法，为我的按钮中的一个，我发现了一些有趣的事情：

1. 我并不需要使用override
2. 我需要设置背景位置“重要！”我的按钮（否则我认为背景显示在按钮外面）
3. 它看起来像你也可以把任何你喜欢的东西放在jQueryUI的主图标名称 - 它只需要一些东西作为占位符。

对于我的应用我结束了：

的Javascript：

jQuery(function() { 
    jQuery('#share-button').button({ 
     icons: { primary: "icons/share" } 
    }); 

}); 

CSS：

#share-button > span.ui-icon { 
    background-image: url(icons/share.png); 
    background-position:0px 3px;} 

HTML：

<button id='share-button'>Share</button>