Делаем эффект гармошки на JQUERY

Для реализации эффекта гармошки есть стандартный тяжелый плагин JQUERY - accordion, его можно найти на оф сайте. Я приведу пример простейшей реализации данного эффекта.

Использование jquery:

  	
$(".subcontent  .month_art").hide();

$(".subcontent #year_art").click(function(){
$(this).next(".month_art").slideToggle(200)
.siblings(".month_art:visible").slideUp("fast");
});

 

Код html :

<div class="subcontent">
  <div class="year_art" id="year_art">
   <a href="#">2010</a>
  </div>
  <div style="display: none;" class="month_art">
   <a href="/year/2010/m/04">- апрель</a>
   <br><a href="/year/2010/m/03">- март</a>
  </div>
  <div class="year_art" id="year_art">
   <a href="#">2009</a>
  </div>
  <div style="display: none;" class="month_art">
   <a href="/year/2009/m/12">- декабрь</a>
   <br><a href="/year/2009/m/10">- октябрь</a>
  </div>
</div>

 






Комментарии (2)

3 июня, 2011  Автор: Ozerman
Солидарен с предыдущим оратором!
20 октября, 2010  Автор: Марат
Интересные заметки, но желательно приводить онлайн-пример для наглядности...;))
АРХИВ
МЕТКИ БЛОГА
follow me 

© GORDOV.COM 2009 — 2020