基础5手风琴暴露内容

Question

我正在尝试使用下面的foundation5代码。问题是内容是在加载时暴露的。我需要它被隐藏，直到点击。我可以把它藏起来，但它不会扩张。如有任何建议，不胜感激。

谢谢

<div class="row">
    <div class="large-12 columns">
    <dl class="accordion" data-accordion>
       <dd class="accordion-navigation">
          <a href="#panel1b">XXXXXXXXS</a>
          <div id="panel1b" class="content active">
             Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
          </div>
       </dd>
    </dl>

Answer 1

根据基金会文档，类active用于显示相应的内容。因此，如果您不希望在页面加载时显示您的内容，请删除active类。此外，确保保持HTML标记干净。在您提供的示例中，我看到了许多无效的标记，如未关闭标记。最终的标记应该是这样的:

<div class="row">
  <div class="large-12 columns">
    <dl class="accordion" data-accordion>
      <dd class="accordion-navigation">
        <a href="#panel1b">XXXXXXXXS</a>
        <div id="panel1b" class="content">Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
      </dd>
    </dl>
  </div>
</div>