Как правильно показывать и скрывать элемент (Animate.css)?

Question

[Михаил Р.]

Изучаю Animate.css, получилось реализовать большинство задумок с анимацией, но встала проблема со следующей задачей:

- По умолчанию потомок скрыт, при наведение на родителя - потомку присваивается класс анимации и класс opened (отменяет режим 'скрытия').
- Название класса анимации берется из data самого потомка.

Вопрос: как грамотнее реализовать появление и скрытие потомка при hover родителя используя Animate.css? Хочется наглядно увидеть, как напишут всю логику работы скрипта люди с опытом...

UPD: У меня например не получилось в конце обратно скрывать потомка...

Код на CodePen.io

Answer 1

[TerNik]

.addClass('opened') - а потом вы не убираете класс, вот и не скрывается потомок.

Comments

[Михаил Р.]

Убрать класс не проблема, проблема убрать его сразу после воспроизведения анимации скрытия потомка...

[TerNik]

Mike Ro,

.dropdown-container.animated
{
  visibility: visible;
}