アコーディオンのアイコンをカスタマイズしたい。ここでページを見つけました http://jqueryui.com/accordion/#custom-icons しかし、ヘッダーとアクティブヘッダーに何かの名前を付けているようです。
画像ファイルへのパスしかない場合、これをどのように行いますか?
アコーディオンのアイコンをカスタマイズしたい。ここでページを見つけました http://jqueryui.com/accordion/#custom-icons しかし、ヘッダーとアクティブヘッダーに何かの名前を付けているようです。
画像ファイルへのパスしかない場合、これをどのように行いますか?
プロジェクトの別の部分に標準アイコンが必要な場合の別のオプションを次に示します。
JS
$(function () {
var icons = {
header: "iconClosed", // custom icon class
activeHeader: "iconOpen" // custom icon class
};
$("#accordion").accordion({
icons: icons
});
});
CSS
.ui-icon.iconOpen {
background:url('YOUR Image HERE') no-repeat;
background-size:20px;
width:20px;
height:20px;
}
.ui-icon.iconClosed {
background:url('YOUR Image HERE') no-repeat -5px;
background-size:30px;
width:20px;
height:20px;
}
使用する予定の jQuery UI アイコンを置き換えるには、カスタム CSS を作成する必要があります。たとえば、コード例の場合:
ui-icon-circle-arrow-e {background-image:url('path/to/my/images/filename.png') !important;}
このSOの質問に非常に似ています
$("#accordion").accordion({
accordion: true,
speed: 500,
closedSign: '<img src="../../images/arrow-forward.png"/>',
openedSign: '<img src="../../images/arrow-down.png"/>'
});