Задать вопрос
@Secret73
javascript

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

Добрый вечер. Имеется вот такой код https://jsfiddle.net/enb8g6n8/12/ Суть его в том, что бы показывать или скрывать красиво и плавно блок. Все работает как нужно, за исключением одного момента:
1. Как сделать закрытие блока, при клике на него же, с сохранением анимации fadeOut?
2. Мне нужно сделать таких блоков 9 штук. Есть ли какое то более красивое и сокращенное решение?
  • Вопрос задан
  • 81 просмотр
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 1
freislot
@freislot
Frontend-разработчик
Для переключения состояния элемента используете .fadeToggle()
Ну и в зависимости от верстки делаете
$(this).next( ".box" ).fadeToggle(1000);
Если скрываемый блок идет после "Кликни меня"
Пример
Ответ написан
1 комментарий
1 комментарий
Пригласить эксперта
Ответы на вопрос 2
AndrewHaze
@AndrewHaze
Умею гуглить яндексом 
$( ".logistics" ).click(function() {
  if ( $( "#box" ).is( ":hidden" ) ) {
    $( "#box" ).fadeIn(1000);
  
  }
});

$( "#box" ).click(function() {
    $( "#box" ).fadeOut(1000);
});
Ответ написан
2 комментария
2 комментария
Destell
@Destell
React, React Native junior developer
2. Мне нужно сделать таких блоков 9 штук. Есть ли какое то более красивое и сокращенное решение?


Что-то вроде
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
summer • Ярославль
от 100 000 до 140 000 ₽
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Дописать функцию на Flutter, работа с yandex map kit
20 апр. 2024, в 04:18
3000 руб./за проект
Английская версия для сайта на WordPress
20 апр. 2024, в 03:34
8000 руб./за проект
Доработать клиентское приложение для GTA 5 на C#
20 апр. 2024, в 00:51
1000 руб./за проект
Ещё заказы