elemen dialog - modal menjadi mudah

Eiji Kitamura

Chrome Canary telah mendapatkan dukungan untuk elemen dialog di balik flag. Elemen dialog dapat digunakan untuk pop-up di halaman web.

  • show(): Membuka dialog.
  • close(): Menutup dialog. Mengambil argumen opsional yang jika ada, dialog.returnValue akan ditetapkan.
  • showModal(): Membuka dialog modal.
  • ::backdrop: Elemen pseudo untuk menata gaya latar belakang di belakang dialog modal.
  • Peristiwa close: Diaktifkan saat dialog ditutup.

Pembaruan pada 16 Desember 2013

Elemen dialog kini mendukung:

  • Peristiwa cancel: Diaktifkan saat tombol Escape ditekan pada dialog modal. Peristiwa ini dapat dibatalkan menggunakan event.preventDefault().
  • Atribut autofocus: Kontrol formulir pertama dalam dialog modal yang memiliki atribut autofocus, jika ada, akan difokuskan saat dialog ditampilkan. Jika tidak ada elemen tersebut, elemen pertama yang dapat difokuskan akan difokuskan.
  • form[method="dialog"]: Hanya valid di dalam dialog. Setelah pengiriman formulir, dialog akan ditutup dan dialog.returnValue akan ditetapkan ke nilai tombol kirim yang digunakan.

Lihat detailnya dengan demo langsung dan polyfill.

Aktifkan dengan mengaktifkan "Aktifkan fitur Platform Web eksperimental" di chrome://flags/.