- Arşiv
- HTML
HTML 5.2 Modal İletişim Kutusu
Abdullah K. · 9 Temmuz 2020 · 1 dk okuma
Kullanıcıların bir hesabı kaldırmaları, kullanıcı adlarını değiştirmeleri veya parasal bir işlemi onaylamaları gerekebilir. Bu gibi durumlarda bir modal (iletişim kutusu) görüntülenmektedir. İlgili yapıyı kurmak için hazır kütüphaneler kullanmak zorundaydık. Ancak bu element ile (<dialog>) kısa süre içerisinde herhangi bir hazır yapı kullanmadan kendi modallarımızı oluşturabileceğiz.
Modal (iletişim kutusu) bir <dialog> öğesi kullanılarak oluşturulur:
<dialog>
<h2>Modal (İletişim Kutusu) Başlığı</h2>
<p>İçerik...</p>
</dialog>
Modal, varsayılan olarak kapalı gelmektedir. Otomatik olarak açılmasını istiyorsanız aşağıdakı yapıyı kullanabilirsiniz:
<dialog open>
Aşağıdaki örnekte modal (iletişim kutusu) kullanımı detaylı olarak anlatılmaktadır:
Tarayıcı uyumluluk tablosu için bağlantıyı tıklayın: https://caniuse.com/#feat=dialog