jquery - 如何自定义 jquery UI Accordion 图标？

Question

我想自定义 Accordion 的图标。我在这里找到了该页面 http://jqueryui.com/accordion/#custom-icons但它似乎为 header 和 activeHeader 提供了一个名称。

如果您只有图像文件的路径，如何做到这一点？

Answer 1

如果您的项目的其他部分需要标准图标，这里还有另一个选项:

<强> Working Example

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;
}