Как сделать анимацию появления карточек по клику кнопки (html/css/js)?

Question

[Иван]

Всем привет!

Я начинающий верстальщик и хочу попробовать скопировать данный сайт: https://marty.education/

Собственно в чем проблема: как мне сделать такую же анимацию появления карточек по клику кнопки?

У меня есть некие знания html, css и js (jQuery), но я сейчас не могу понять как это реализовано. Хотелось бы чтобы кто-то, знающий эту область, доходчиво мне это объяснил.

Спасибо за внимание)

Comments

[dmitry-toster]

не благодарите. анимация называется fadeInLeft

[Иван]

dmitry-toster, да, анимация то fadeInLeft, но как сделать смену класса одного блока на, к примеру, с active на hide, при нажатии на разные кнопки. Там ведь 6 разных кнопок и блоков, которые вылазят, и нужно чтобы все они друг с другом взаимодействовали (нажал на 1 кнопку - вылез один блок, нажал на 2 кнопку - у этого блока поменялся класс, он залез, а у второго класс добавился, он вылез). Как сделать такое, не знаю как сказать, мульти взаимодействие что ли.

[iBird Rose]

I_Mimic_I, это называется табы. берешь любой пример, к примеру отсюда https://codepen.io/tag/tabs
и применяешь анимацию сказанную выше

[dmitry-toster]

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

[Иван]

iBird Rose, dmitry-toster, спасибо за ответы. Теперь, думаю, я смогу это сделать