TECRÜBEMİZİ YAZILIMCILARLA
PAYLAŞIYORUZ.
BİLGİ PAYLAŞTIKÇA ÇOĞALIR
BLOG
HTML5.2 Modal (İletişim Kutusu)
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