0

jQueryを使用して動的に作成したボタンにアイコンを追加しようとしています。ボタンのcssクラスを作成しました。実行すると、画像ではなく、ボタンの横に灰色の丸い円が表示されます。要素を調べると、ボタンの画像が上書きされていることがわかります。

灰色の円の代わりにボタン アイコンが表示されるようにするにはどうすればよいですか? 私が使用したコードは次のとおりです。

JS:

var btn1 = $("<button/>", {'id': 'TestButton'}).html('Sample Button');
btn1.buttonMarkup({ theme: 'c', icon: 'btn1' });

CSS:

.ui-icon-btn1 {
    background-image: url('../../images/gallery.jpg');
    background-color: rgb(255,255,255);
    border-style: hidden;
    -webkit-box-shadow: none;
    box-shadow: none;
}
4

1 に答える 1

1

簡単な解決策は、!importantそのプロパティに配置することです。

background: url('../../images/gallery.jpg') !important;
background-color: rgb(255,255,255) !important;

これは、jQuery-mobile の同様の問題で私にとってはうまくいきました。

編集：

ボタンの周りのディスクを削除するには、追加する必要があります

`border: 0 !important;`

クラスへ

.ui-li-link-alt .ui-btnただし、 jQuery UIのデフォルトの動作をオーバーライドしないようにしてください。

于 2013-10-23T05:58:37.633 に答える