jquery-uiのアイコンを置き換える方法は？

Question

私は、jquery-uiパッケージに付属しているデフォルトのサイズ変更可能なアイコンの代わりに、resize_handle.pngイメージを使用したいと思います。それを行う簡単な方法はありますか？

Answer 1

はい、ui-icon-refreshのCSSクラスを、選択した背景イメージで上書きすることができます。

.ui-icon-refresh { 
    background-image: url(../images/icons/icons.png); 
    background-position: -64px -80px; 
} 

styles for each type of state（ui-state-default、ui-state-hover、など）もあります。だからあなたもそれらをオーバーライドする必要があるかもしれません。

.ui-state-default .ui-icon-refresh, 
.ui-state-hover .ui-icon-refresh { 
    background-image: url(../images/icons/icons.png); 
    background-position: -64px -80px; 
} 

それとも、あなたはjQueryのUIのCSSで定義された、より具体的な状態のスタイルを上書きするような重要なカスタムCSSをマークすることができます。

.ui-icon-refresh { 
    background-image: url(../images/icons/icons.png) !important; 
    background-position: -64px -80px !important; 
} 

（[自身の画像とのjQuery UIボタンのアイコンを変更する]の