jQuery UI - 手风琴 - 设计活动标题？
简单的问题：我使用的 Accordion 没有任何 UI 主题（只是准系统，使用我自己的 CSS）。
到目前为止，一切都很好，只是我无法弄清楚如何为当前选定的标题设置“活动”样式。
jQuery 代码：
$("#menu").accordion({
event: "mouseover",
header: "a.top"
});
HTML 代码：
<a href="#" class="top">XXX1</a>
<div class="sub">
<a href="#">Subheading 1</a>
<a href="#">Subheading 2</a>
<a href="#">Subheading 3</a>
</div>
<a href="#" class="top">XXX2</a>
<div class="sub">
<a href="#">Subheading 1</a>
<a href="#">Subheading 2</a>
<a href="#">Subheading 3</a>
</div>
这非常有效，只是我无法找到一种方法来定义活动标题的样式而不使用 ThemeRoller。
在我的 CSS 中手动设置以下样式没有效果：
.ui-state-active
.ui-widget-content .ui-state-active
.ui-state-active a
.ui-state-active a:link
.ui-state-active a:visited
请帮忙？
Simple issue: I am using Accordion without any UI themes (just barebones, using my own CSS).
So far, so good, except that I cannot figure out how to set an "active" style for the currently selected header.
The jQuery code:
$("#menu").accordion({
event: "mouseover",
header: "a.top"
});
The HTML code:
<a href="#" class="top">XXX1</a>
<div class="sub">
<a href="#">Subheading 1</a>
<a href="#">Subheading 2</a>
<a href="#">Subheading 3</a>
</div>
<a href="#" class="top">XXX2</a>
<div class="sub">
<a href="#">Subheading 1</a>
<a href="#">Subheading 2</a>
<a href="#">Subheading 3</a>
</div>
This works great, except that I cannot find a way to define the styles for the active header without using ThemeRoller.
Manually setting the following styles in my CSS has no effect:
.ui-state-active
.ui-widget-content .ui-state-active
.ui-state-active a
.ui-state-active a:link
.ui-state-active a:visited
Assistance, please?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
我也在这个问题上挣扎过。我去掉了 a.nav 链接周围的 h3 标签并指定了标题：“.nav”。在我的 CSS 中，我包含了“a.ui-state-active”来更改打开的折叠式 div 的标题。对我来说，前面加上“a”就产生了不同。
I struggled with this one, too. I stripped away the h3 tags that were surrounding my a.nav links and specified header: '.nav'. In my css, I included "a.ui-state-active" to change the header of the open accordion div. For me prepending the "a" made the difference.
使用“主动”控制。不确定它是否可以在没有
themeroller的情况下工作。该小部件具有用于创建菜单的所有“标题”的运行计数。索引 0 是第一个 xxx1，索引 1 是第二个 xxx2，依此类推...Use the "active" control. Not sure if it works without
themeroller. The widget has a running count of all the "header"'s used to create your menu. Index 0 is the first one xxx1, Index 1 is the second one xxx2, etc...对于仍在使用 jQuery-ui 的任何人，只需将其添加到您的 CSS 中：
只需更改您想要的颜色或背景！
For anyone still using jQuery-ui just add this to your CSS:
Just change the color or background you want!