jquery-ui - jQueryUI ボタン​​のカスタム アイコンを設定できますか

Question

カスタムアイコン、つまり、jQueryUI で提供されるスプライトアイコンの一部ではないアイコンを使用して jQueryUI ボタン​​を作成することは可能ですか?

3 つのチェックボックスのグループに ButtonSet 機能を使用していますが、標準で提供されているものよりも様式化されたアイコンが必要です...

Answer 1

CSSハックで解決しました。

通常どおりにボタンをセットアップし、プライマリ アイコンに以下に定義する「エラー」クラスを指定します。

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

!important は、background-image の ui-icon 定義をオーバーライドします。

Answer 2

ボタンの 1 つにこのアプローチを採用したところ、いくつかの興味深いことがわかりました。

1. 「!important」オーバーライドを使用する必要はありませんでした
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>