0

这是我的手风琴，我如何将一些样式表应用到这个，所以它看起来像一棵树。

例如：+当手风琴选项卡关闭和-手风琴打开时

<div class="Accordion" id="systemAccordion" tabindex="1">
                <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&nbsp;&nbsp;&nbsp;&nbsp;<a onClick="showSystemSpan();">System</a></div>
                    <div class="AccordionPanelContent">
                        <a onClick="showPatchesSpan();">Patches</a><br/>
                        <a onClick="showNetworkSpan();">Network</a><br/>
                    </div>
                </div>
                <div class="AccordionPanel">
                    <div class="AccordionPanelTab" >&nbsp;&nbsp;&nbsp;&nbsp;<a onClick="showNone();">User Environment</a></div>
                    <div class="AccordionPanelContent">
                        <a onClick="showEnvironmentVariableSpan();">Environment Variables</a><br/>
                    </div>
                </div>
                <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&nbsp;&nbsp;&nbsp;&nbsp;<a onClick="showSystemSpan();">{mainData::@product}</a></div>
                    <div class="AccordionPanelContent">
                        <a onClick="showOdbcSpan();">ODBC</a><br/>
                        <a onClick="showBitmodeSpan();">Bitmode</a><br/>
                    </div>
                </div>
                <script type="text/javascript">
                    var sysAcc = new Spry.Widget.Accordion("systemAccordion",  {defaultPanel: -1, useFixedPanelHeights: false });
                </script>
            </div>
4

2 回答 2

1

如果您查看 SpryAccordion.css 样式表，您会发现

.AccordionPanelTab {}

.AccordionPanelOpen .AccordionPanelTab {}

您可以在这两个上设置您喜欢的任何背景图像以获得您想要的效果。AccordionPanelTab 将影响正常状态，.AccordionPanelOpen .AccordionPanelTab 将影响打开状态。样式表中还有注释告诉您不同类的作用。

于 2011-06-07T10:35:43.670 回答
0

使用 css 背景图像属性并在打开和关闭时将其应用于正确的 css 类。

于 2011-06-07T10:40:51.740 回答