v2.5.2
Giriş yap

css kutucuklarla ilgili

siyahkalem
268 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..

  1. Ekle butonu tıkla
  2. Kutucuk açıldı
  3. sayfanın herhangi bir yerine tıklandığında display none olsun
Cevap yaz
Cevaplar (1)
sinandmr
968 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.