1

ダイアログボックスのルックアンドフィールをカスタマイズしようとしている次のスクリプトがあります。

http://jsfiddle.net/7CvZ9/18/

しかし、閉じるアイコンをカスタマイズする方法がわからないようです。

誰かがそれを行う方法を知っていますか?

ダイアログの他の部分をカスタマイズしましたが、テーマAPIを確認しています。

http://jqueryui.com/docs/Theming/API

しかし、そのリンクから、閉じるアイコンをカスタマイズする方法がわかりません。

したがって、基本的には、既存の2状態画像を自分の2状態画像スプライトファイルに置き換えたいと思います。

4

3 に答える 3

4

このCSSを使用します:

.ui-dialog-titlebar-close {
    /* Default image */
    background-image:url('http://www.charlottemotorspeedway.com/images/icon_x.png');
}

.ui-dialog-titlebar-close:hover,
.ui-dialog-titlebar-close:focus {
    background-color:transparent !important;
    border:none !important;
    /* Hover state image */
    background-image:url('http://www.charlottemotorspeedway.com/images/icon_x.png') !important;
}

たとえば、Xを新しい画像に交換しました:http://jsfiddle.net/AlienWebguy/7CvZ9/22/

于 2011-07-10T09:46:48.663 に答える
0

jQuery uiテーマには、すべてのアイコンがグループ化され、同じファイルに編成されたスプライト画像が含まれています。

カスタマイズしたテーマファイルのアイコンを変更できます。

ファイルの名前は次のようになります。ui-icons_222222_256x240.png

imagesテーマのフォルダに入れることができます

画像は次のようになります。

ここに画像の説明を入力してください

于 2011-07-10T09:41:30.223 に答える
0

閉じるアイコンに関係するクラスは次のとおりです。

.ui-dialog-titlebar-close 
.ui-icon-closethick

これは生成されたマークアップです

<a href="#" class="ui-dialog-titlebar-close ui-corner-all" role="button">
<span class="ui-icon ui-icon-closethick">close</span>
</a>

ボタンの外観を変更するには、これら2つのクラスをオーバーライドする必要があると思います

于 2011-07-10T09:45:29.540 に答える