6

アコーディオンのアイコンをカスタマイズしたい。ここでページを見つけました http://jqueryui.com/accordion/#custom-icons しかし、ヘッダーとアクティブヘッダーに何かの名前を付けているようです。

画像ファイルへのパスしかない場合、これをどのように行いますか?

4

3 に答える 3

34

プロジェクトの別の部分に標準アイコンが必要な場合の別のオプションを次に示します。

実施例

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;
}
于 2013-07-23T18:41:56.040 に答える
4

使用する予定の jQuery UI アイコンを置き換えるには、カスタム CSS を作成する必要があります。たとえば、コード例の場合:

ui-icon-circle-arrow-e {background-image:url('path/to/my/images/filename.png') !important;}

このSOの質問に非常に似ています

于 2013-07-23T17:22:00.833 に答える
-1
$("#accordion").accordion({
  accordion: true,
  speed: 500,
  closedSign: '<img src="../../images/arrow-forward.png"/>',
  openedSign: '<img src="../../images/arrow-down.png"/>'
}); 
于 2015-03-30T10:03:18.547 に答える