Dialog modal HTML

Fokus rein. Fokus bleibt. Fokus zurück.

Bauen Sie ein modales Fenster mit <dialog> und öffnen Sie es mit showModal(). Der Browser sperrt die restliche Seite, hält Tab im Dialog, schließt per Escape und führt den Fokus zum Auslöser zurück.

Native Fokusbahn

Ein Modal ist ein Fokus-Kreislauf.

dialog.showModal()
  1. 01Auslöser
  2. 02Hinein
  3. 03Tab bleibt
  4. 04Zurück

Dialog öffnen, Fokusbahn testen.

Modaler Dialog

Bericht löschen?

Diese Demo löscht keine Daten.

Tab bleibt hier · Escape schließt

Entscheidend: Das open-Attribut macht den Dialog nur sichtbar. Erst showModal() macht ihn modal.