3

我正在使用 Jquery 手风琴插件。我需要使用自己的标题图标，根据文档，我需要使用背景图像创建 css 类。

所以我在我的css文件中做了这个。

.normal_arrow {
    background : url(../images/arrowonly.jpg);
}

.circle_arrow {
    background : url(../images/circle_arrow.jpg);
}

.circle_arrow_down {
    background : url(../images/circle_arrow_down.jpg);
}

然后在javascript中：

$("#accordion").accordion({
    header: "h3",
    clearStyle: true,
    autoHeight: false,
    icons: {
        header: "normal_arrow",
        headerSelected: "circle_arrow_down"               
    }
});

但没有箭头出现。

4

6 回答 6

3

同样的问题，我不得不使用 position:absolute; 使图标容器具有宽度和高度。

.normal_arrow {
    background : url(../images/arrowonly.jpg);
    position: absolute;
    width: 10px;
    height: 10px
}
于 2011-07-04T00:29:36.127 回答
2

您的代码看起来正确。

尝试使用background-image:而不是background:

还可以使用一种工具Firebug来绝对确保亲属路径朝着您认为的方向前进。

于 2009-02-10T01:37:36.883 回答
1

使用!important：

.normal_arrow {
    background : url(../images/arrowonly.jpg) !important;
}

因为您需要覆盖默认样式。

于 2011-01-26T13:15:01.340 回答
0

在 CSS 中使用 background-image 而在 JavaScript 中，您需要将 header 和 headerSelected 放在引号中。

于 2009-05-28T16:14:07.933 回答
0

背景使用不当。为此渲染可能使用

background-image: url(../images/circle_arrow.jpg);

或者

background: transparent url(../images/circle_arrow.jpg) top left no-repeat;
于 2009-05-28T16:19:12.947 回答
0

注意：这仅适用于不使用任何 jquery 样式的用户。（即）您没有在文件中包含 jquery 的 css。

CSS 中的默认样式是这样的：

.ui-icon { display: none; text-indent: -99999px; overflow: hidden; background-repeat:  no-repeat; }

所以如果你设置了一个带有背景图片，宽度和高度的div，但它仍然不会显示，这是因为上面的类。

将此添加到您的文档中：

<style type="text/css">
.ui-icon { display: block; }

</style>
于 2011-09-12T16:27:28.877 回答