isaev_rail
@isaev_rail
HTML - верстальщик

Как добавить класс при клике, а потом удалить при клике за пределами открывшегося блока?

При клике на кнопку к родительскому блоку надо добавить класс, для того что бы он увеличился в размерах, а внутри него появились скрытые элементы.
Заново свернуть блок надо будет при нажатии вне этого блока.

Вот этот код разворачивает блок, увеличивая ширину контейнера и показывает скрытые элементы:

$('.services_btn').click(function(e){
            $(this).parent().parent().addClass('open');

            e.preventDefault();
        });

Нужно теперь просто удалить этот класс при клике за пределами открывшегося блока.
И как ещё сделать чтобы блок открывался и закрывался плавно. А то сейчас у меня увеличивается мгновенно.
  • Вопрос задан
  • 6046 просмотров
Решения вопроса 1
Stalker_RED
@Stalker_RED
При любом клике проверяем, был ли он внутри вашего разворачиваемого элемента или нет.
А плавность можно добавить за счет css свойства transition, например.

https://jsfiddle.net/azvt2fvu/
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
Zoxon
@Zoxon
Веб-разработчик
Простейший дропдаун codepen.io/Zoxon/pen/YwpLpK
Ответ написан
Комментировать
zualex
@zualex
Senior Software Engineer
Сделал пример отвечающий на ваши вопросы: codepen.io/zualex/pen/aNZLEP
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы