Posted By

ricosushi on 07/14/10


Tagged

accordion


Versions (?)

Who likes this?

13 people have marked this snippet as a favorite

ricosushi
sdpfost
legacye
ions
dhollifield
fenta23
rageit
jay0917
damsean102
acousins
sethetter
batandwacolani
ringo380


Accordion


 / Published in: jQuery
 

URL: http://luiszuno.com/themes/watercolor/spring/about.html

Accordion boxes with jquery

  1. // accordion
  2. $('.accordion-container').hide();
  3. $('.accordion-trigger:first').addClass('active').next().show();
  4. $('.accordion-trigger').click(function(){
  5. if( $(this).next().is(':hidden') ) {
  6. $('.accordion-trigger').removeClass('active').next().slideUp();
  7. $(this).toggleClass('active').next().slideDown(); }
  8. return false;
  9. });
  10.  
  11.  
  12. // usage
  13. <h2 class="accordion-trigger custom2"><a href="#">Item 1</a></h2>
  14. <div class="accordion-container">
  15. <div class="block">
  16. <p>Eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. </p>
  17. </div>
  18. </div>
  19.  
  20. <h2 class="accordion-trigger custom2"><a href="#">Item 2</a></h2>
  21. <div class="accordion-container">
  22. <div class="block">
  23. <p>Pellentesque habitant, sagittis tempus lacus enim ac dui. </p>
  24. </div>
  25. </div>

Report this snippet  

You need to login to post a comment.