Как я могу сделать легкий аккордеон, используя jQuery? - PullRequest
Новая
       21

Как я могу сделать легкий аккордеон, используя jQuery?

0 голосов
/ 03 августа 2011

У меня есть эта HTML-структура, и мне нужно, чтобы при нажатии на «.open_panel» элемент с именем «.utenti_iscritti» стал видимым и скользил вниз. Очевидно, я не могу использовать уникальный идентификатор, потому что это структура, которая многократно повторяется на странице (это список уроков).

Большое спасибо!

А это мой код: 

    <script type="text/javascript">
        $(".open_panel").click(function() {
                $(this).parent().parent().next("div.utenti_iscritti").slideToggle(300).siblings("div.utenti_iscritti").slideUp("slow");
                //$(this).siblings().css({backgroundImage:"url(left.png)"});
        });
</script>

<div class="lezione">
        <div class="intro">
        <h5>09:00 - 10:00</h5>
        <h4>Walking</h4>
        <h6>Sala Walking con Francesco</h6>
        <div class="action libero">
        <span class="contatore">2</span>
        <h6><a class="open_panel" href="#" title="Ci sono ancora posti liberi">Iscritti</a></h6>
                </div><!--action-->
        </div><!--intro-->

        <div class="utenti_iscritti">
        </div><!--utenti_iscirtti-->

</div><!--lezione-->

Ответы [ 3 ]

1 голос
/ 03 августа 2011

Я бы использовал аккордеон в jQuery UI

Здесь также есть страница демонстраций: http://jqueryui.com/demos/accordion/

1 голос
/ 03 августа 2011

посмотрите на closest () -функцию jquery: 

$(".open_panel").click(function() {
$(this).closest("div.utenti_iscritti").slideToggle(300).siblings("div.utenti_iscritti").slideUp("slow");
});
0 голосов
/ 03 августа 2011

a Быстрый Google показывает тонны аккордеонного контроля. Я бы рекомендовал использовать jQuery UI аккордеон , который я использую. Есть тонны демонстраций и примеров кода, и это приятно и легко скинуть с помощью онлайн-генератора скинов.

...