Как открыть конкретный div с помощью скрипта?

Question

[spacekk]

Помогите пожалуйста допилить скрипт. Есть список товаров, при клике на ссылку раскрывается блок с ссылками. Как заставить скрипт открывать один блок, а не все сразу?

Сейчас работает следующим образом - codepen

И как реализовать такую анимацию? Чтобы последовательно блок ехал вбок, потом вниз.

Answer 1

[Денис Богданов]

В callback'е, после клика на .catalog-btn ты обращаешься ко всем элементам, а надо только к тем, которые внутри данного блока, для этого следует добавить контекст, замени:

$('.catalog-hidden-list').slideDown('1000',"swing");

на:

$('.catalog-hidden-list', $(this)).slideDown('1000',"swing");

ну и аналогичным образом со всеми элементами внутри callback-функции.
Контекст в данном случае - это то внутри чего будет происходить поиск, ты ищешь на всём документе. jQuery в callback-фукнциях события в this возвращает элемент, с которым связано действие, вот ты его и передаешь в качестве контекста.

Чтобы блок ехал вниз и в бок тебе надо использовать $.animate, когда анимация вниз закончится, в callback-функции вызываешь для этого же блока анимацию изменения ширины.
Второй вариант использовать анимацию на css.

Comments

[spacekk]

Спасибо большое за подробный ответ!