我可以設置一個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>