gpt4 book ai didi

javascript - 切换 JQuery Accordion 的背景颜色

转载 作者:太空宇宙 更新时间:2023-11-04 16:27:07 25 4
gpt4 key购买 nike

我在实现一个 JavaScript 切换控件中使用的相同 CSS 样式以用于不同的 JQuery Accordion 控件时遇到了一些麻烦

切换控件 - 这是我需要的样式:http://jsfiddle.net/NinjaSk8ter/yXNmx/

Accordion 控件 - 这是我需要为其应用样式的 Accordion 控件。

具体来说:当您点击切换链接时,您会看到灰色标题出现。对于始终显示灰色标题的 Accordion 控件。这应该仅在单击时出现,就像切换控件的情况一样。

我需要复制的另一种样式是每个问题之间的间距量。填充是否足以包装 anchor 标记的类?每当我为此类添加 Top-Margin 时, Accordion 中就会出现抖动。

对于 Accordion,我为包装 anchor 标记的 DT 元素添加了 class="factterm"。

我将其添加到 Accordion 中。

    <body>
<div id="galColumn">
<div class="contentbox">
<dl>
<dt class="factterm">
<a id="A1" href="javascript://" class="questionLink">Question1</a>
</dt>
<dd id="1" class="answer">
<div class="indent-box">
Answer1
</div>
</dd>
<dt class="factterm">
<a id="A2" href="javascript://" class="questionLink">
Question2</a>
</dt>
<dd id="2" class="answer">
<div class="indent-box">
Answer2
</div>
</dd>
</d1>
</div>
</div>
</body>

.indent-box
{
padding: 5px;
}
.factterm
{
/*margin-top: 2px;*/
padding: 2px 5px 0;
/*width: 525px;*/
}
#accordion .handle
{
width: 260px;
height: 30px;
background-color: orange;
}
#accordion .section
{
width: 260px;
height: 445px;
background-color: #a9a9a9;
overflow: hidden;
position: relative;
}

之前有人提到我需要添加 JavaScript 来删除具有设置背景颜色的背景属性的 bg 类。

<html>
<head>
<title></title>
<style type="text/css" media="screen">
dt{ background-color: #ccc; }
dd { height: 100px; }
</style>
</head>
<body></body>
</html>

最佳答案

  1. 在样式 block 中删除 dt 背景样式:dt{
    背景色:#ccc;
    }
  2. 添加这个类 .active {background:#a9a9a9}
  3. 为了切换事件类,将此行添加到您的点击函数 $(this).addClass('active').siblings().removeClass('active'); <

您可以在此处查看工作示例:http://jsfiddle.net/pratie/xGwpk/

关于javascript - 切换 JQuery Accordion 的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5313583/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com