Help: Accordions: verschil tussen versies

Huidige versie van 20 mrt 2017 om 19:27

Standaard Accordions

Je kunt met ingekorte code accordions creëren: PS: Eigenlijk is het correcte Nederlandse woord: accordeon, maar dat werkt verwarrening in de hand met de engelse codes.

Markup

<div class="panel-group" id="accordion">
 <accordion parent="accordion" heading="SECTIE1">
   Lorem ipsum...
 </accordion>
 <accordion parent="accordion" heading="SECTIE2">
   Lorem ipsum...
 </accordion>
</div>

Resultaat

HTML

 <div id="accordion" class="panel-group">
   <div class="panel panel-default">
     <div class="panel-heading">
       <h4 class="panel-title">
         <a href="#accordion1" data-parent="#accordion" data-toggle="samenvouwen">
           SECTION1
         </a>
       </h4>
     </div>
     <div class="panel-collapse collapse" id="accordion1">
       <div class="panel-body">
         Lorem ipsum...
       </div>
     </div>
   </div>
   <div class="panel panel-default">
    <div class="panel-heading">
       <h4 class="panel-title">
         <a href="#accordion2" data-parent="#accordion" data-toggle="samenvouwen">
           SECTIE2
         </a>
       </h4>
     </div>
     <div class="panel-collapse collapse" id="accordion2">
       <div class="panel-body">
         Lorem ipsum...
       </div>
     </div>
   </div>
 </div>