HTML 5.2 ile Birlikte Getirilen "Dialog" Elementi ve Kullanımı

HTML konusunda insanlığın ulaştığı son nokta ve standart HTML 5.2, bize

adı verilen yeni bir eleman getiriyor. Yeni Dialog elementi; JavaScript ile etkileşimli hale getirilebilen kalıcı iletişim kutuları oluşturmamızı yardımcı oluyor.

öğesini kullanmak oldukça basit ve temel formu şu şekilde:

Bu bir dialog kutusudur

Elemente ek olarak kullanılan “open” ek değeri (additional attribute), kutunun görüntülendiğinden emin olmamıza yardımcı oluyor. Bu ek değeri kullanmadığımızda, kutuyu biçimlendirmek için JavaScript kullanmamış olmamız gerekiyor.

CSS’in tüm HTML elementlerinin makyajı olduğu aşikar,

ögesi de CSS kullanılmadığında üvey evlat çirkinliğiyle açılan bir internet sayfasından bizleri selamlıyor. Sayfanın orta bölümünde etrafı siyah bir çerçevele kaplı olan kutu, içeriğin boyutuna göre otomatik olarak şekil alıyor.

HTML diyalog (

) elementini kullanarak yapabileceklerinizin bir sınırı yok. Tamamen hayal dünyanıza ve ihtiyaçlarınıza kalmış. Teorik olarak diğer HTML elementleriyle birlikte kullanılması konusunda dialog için belirlenmiş bir kısıtlama bulunmuyor. Yine de JavaScript ile güçlendirilmemesi halinde çok kısıtlı bir kullanım alanı mevcut. JavaScript ile showModal() ve close() sayesinde, önceden bahsettiğimiz open ek değerini de kontrol edebilirsiniz.


"Dialog" HTML elementi, yeni bir element mi?
Birçoğumuzun bildiği üzere aslında

yeni bir HTML elementi değil. Chrome 2014 yılından bu yana

elementini desteklerken, Firefox ise aynı element için opsiyonel şekilde aktif edilebilir destek sunuyor. İsteyen Firefox kullanıcıları tarayıcı ayarlarından bunu açık konuma getirdiklerinde dialog elementini görüntüleyebiliyor. Microsoft yeni elementi Edge’ye eklemeyi düşünürken, Safari ve diğerleri şimdilik Dialog elementi konusunda uzlaşmış değiller.

Yani, eleman aslında gerçek anlamda yeni değil fakat standarda yenice eklenilerek HTML 5.2 standardının bir parçası haline getirilmiştir.

Being Bilgiler için teşekkür ederim.Yazı çok güzel olmuş elinize sağlık.Özellikle "

ögesi de CSS kullanılmadığında üvey evlat çirkinliğiyle açılan bir internet sayfasından bizleri selamlıyor." cümlesi beni baya bir güldürdü :)

Bu tarz yeni kodları paylaşman diğer makalelerine göre daha çok hoşuma gidiyor teşekkürler :)