css kutucuklarla ilgili

siyahkalem 1181 gün önce

319 defa görüntülendi

Merhaba,
Benim bir kutum var. Kutuyu bir buton yardımıyla display block ediyorum ama kapatmayı da sayfanın herhangi bir yerine tıkladığında olsun istiyorum. Bu durumda nasıl yapabilirim? Kullandığım teknoloji vuejs..

Ekle butonu tıkla
Kutucuk açıldı
sayfanın herhangi bir yerine tıklandığında display none olsun

Soru hatalı mı? 👎

Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!

Spam olarak işaretle

Cevaplar (1)

sinandmr

1181 gün önce

if (modal.classList.contains('active')) {
  window.addEventListener('click', () => {
    modal.classList.remove('active');
  });
}

kutucuğunu modal adında bir değişkene document.querySelector('.modal') gibisinden çekmelisin.
Sonrasında da kutucuğun açık olduğu classı içeriyorsa buna bir olay dinleyicisi ekle.
Sadece kutu açıkkan çalışacak bu sayede.
Sonrasındaki kod da ekranda nereye tıklarsan tıkla modaldaki active class'ını kaldıracak. Bu sayede kutucuk kapalı olacak.

#007142