elemento di dialogo - finestra modale semplificata

Eiji Kitamura
Eiji Kitamura

Chrome Canary supporta l'elemento di dialogo dietro un flag. L'elemento dialog può essere utilizzato per i popup di una pagina web.

  • show(): apri la finestra di dialogo.
  • close(): chiudi la finestra di dialogo. Prende un argomento facoltativo su cui, se presente, è impostato dialog.returnValue.
  • showModal(): apri la finestra di dialogo modale.
  • ::backdrop: pseudo-elemento per applicare uno stile allo sfondo dietro una finestra di dialogo modale.
  • Evento close: viene attivato quando viene chiusa una finestra di dialogo.

Aggiornamento del 16 dicembre 2013

L'elemento dialog ora supporta:

  • Evento cancel: viene attivato quando viene premuto il tasto Esc in una finestra di dialogo modale. Questo evento può essere annullato utilizzando event.preventDefault().
  • Attributo autofocus: il primo controllo modulo in una finestra di dialogo modale con l'eventuale attributo autofocus sarà attivo quando viene visualizzata la finestra di dialogo. Se questo elemento non è presente, viene impostato lo stato attivo sul primo elemento attivabile.
  • form[method="dialog"]: valido solo all'interno di una finestra di dialogo. Dopo l'invio del modulo, chiude la finestra di dialogo e imposta dialog.returnValue sul valore del pulsante di invio utilizzato.

Dai un'occhiata ai dettagli con una demo dal vivo e il polyfill.

Attiva l'opzione "Attiva funzionalità sperimentali della piattaforma web" in chrome://flags/.