Comment mettre plusieurs "accordion sliders" sur une même page?

bonjour,
j'essaie de mettre plusieurs accordion sliders sur une même page html, dans le de présenter une équipe. chaque fois il y une photo et un petit texte explicatif qui s'ouvre ou se ferme. je me sert d'un template, j'essaie de faire un copié-collé du code, mais ça ne fonctionne pas ...

 

est-ce que quelqu'un pourrait m'aider ??

 

merci

 

voici le code que j'essaie de dupliquer sans succès :

 

<!-- start accordion slider -->

           <ul class="accordion-slider">

      

        <li class="step listitem" style="max-width:342px">

        <div class="photo-preview title handle">

        <img width="130" height="205" src="images/team/susanna.png" alt="susanna" title="susanna" />

                                <h5><span>susanna</span></h5>

        <p class="profile">web designer</p>

        </div>

        <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>sed nec placerat odio</strong>.  vestibulum in orci nec turpis ultrices malesuada @ et dolor. praesent  dapibus augue ac mauris fringilla condimentum vestibulum!</p>

        </li>

      

        <li class="step listitem" style="max-width:342px">

        <div class="photo-preview title handle">

        <img width="130" height="205" src="images/team/samuel.png" alt="samuel" title="samuel" />

                                <h5><span>samuel</span></h5>

        <p class="profile">art director</p>

        </div>

        <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>sed nec placerat odio</strong>.  vestibulum in orci nec turpis ultrices malesuada @ et dolor. praesent  dapibus augue ac mauris fringilla condimentum vestibulum!</p>

        </li>

      

        <li class="step listitem" style="max-width:342px">

        <div class="photo-preview title handle">

        <img width="130" height="205" src="images/team/thomas.png" alt="thomas" title="thomas" />

                                <h5><span>thomas</span></h5>

        <p class="profile">sales account</p>

        </div>

        <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>sed nec placerat odio</strong>.  vestibulum in orci nec turpis ultrices malesuada @ et dolor. praesent  dapibus augue ac mauris fringilla condimentum vestibulum!</p>

        </li>

      

        <li class="step listitem" style="max-width:342px">

        <div class="photo-preview title handle">

        <img width="130" height="205" src="images/team/victor.png" alt="victor" title="victor" />

                                <h5><span>victor</span></h5>

        <p class="profile">customer service</p>

        </div>

        <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>sed nec placerat odio</strong>.  vestibulum in orci nec turpis ultrices malesuada @ et dolor. praesent  dapibus augue ac mauris fringilla condimentum vestibulum!</p>

        </li>

      

        <li class="step listitem" style="max-width:342px">

        <div class="photo-preview title handle">

        <img width="129" height="205" src="images/team/jasmine.png" alt="jasmine" title="jasmine" />

                                <h5><span>jasmine</span></h5>

        <p class="profile">copywriter</p>

        </div>

        <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>sed nec placerat odio</strong>.  vestibulum in orci nec turpis ultrices malesuada @ et dolor. praesent  dapibus augue ac mauris fringilla condimentum vestibulum!</p>

        </li>

      

        </ul>  

           <!-- end accordion slider -->

the broad answer: use different id each of sliders , use id in constructors.

 

the bespoke answer: please supply full code page including css , js. best way upload site , give url.

More discussions in Dreamweaver support forum

adobe