Question

我在实现与一个JavaScript Toggle Control中使用的相同CSS样式时遇到一些麻烦，以便在不同的JQuery Accordion Control中使用

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

手风琴控制 - 这是我需要应用样式的手风琴控制。

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

我需要复制的另一个样式是每个问题之间的间距。 Padding是否足以满足包含Anchor Tag的类？每当我为这个类添加一个Top-Margin时，手风琴中就会出现抖动。

对于Accordion，我为包含Anchor Tag的DT元素添加了class =“factterm”。

我将此添加到手风琴中。

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

Answer 1

在样式块中删除dt背景样式：dt{ background-color: #ccc; }
添加此课程.active {background:#a9a9a9}
要切换活动类，请将此行添加到您的点击功能$(this).addClass('active').siblings().removeClass('active');

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

切换JQuery手风琴的背景颜色

1 个答案: