/ / foundation 5 accordion exposto conteúdo - zurb-foundation-5

fundação 5 conteúdo exposto acordeão - zurb-foundation-5

Eu estou tentando usar o código abaixo de foundation5. O problema é que o conteúdo é exposto no carregamento. Eu preciso que ele fique oculto até que seja clicado. Eu consegui escondê-lo, mas ele não se expandirá. Qualquer sugestão seria muito apreciada.

Obrigado

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

Respostas:

1 para resposta № 1

Conforme Documentação de fundação, a classe active é usado para exibir o conteúdo correspondente. Portanto, se você não quiser que seu conteúdo seja exibido quando a página for carregada, remova a classe active. Além disso, mantenha sua marcação HTML limpa. Vejo muitas marcações inválidas e inválidas, como tags não fechadas, no exemplo que você forneceu. Sua marcação final deve ficar assim:

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