dialoogelement - modaliteiten gemakkelijk gemaakt

Eiji Kitamura

Chrome Canary biedt nu ondersteuning voor het dialoogelement achter een vlag. Dit element kan worden gebruikt voor pop dialog ups op een webpagina.

• show() : Dialoog openen.
• close() : Sluit dialoog. Neemt een optioneel argument dat, indien aanwezig, wordt ingesteld op dialog.returnValue .
• showModal() : Open modaal dialoogvenster.
• ::backdrop : Pseudo-element voor de stijl van de achtergrond achter een modaal dialoogvenster.
• close : wordt geactiveerd wanneer een dialoogvenster wordt gesloten.

Update op 16 december 2013

Het dialog ondersteunt nu:

• cancel gebeurtenis: wordt geactiveerd wanneer de Escape-toets wordt ingedrukt in een modaal dialoogvenster. Deze gebeurtenis kan worden geannuleerd met event.preventDefault() .
• autofocus : Het eerste besturingselement in een modaal dialoogvenster met het autofocus , indien aanwezig, krijgt de focus wanneer het dialoogvenster wordt weergegeven. Als er geen dergelijk element is, krijgt het eerste focusbare element de focus.
• form[method="dialog"] : Alleen geldig binnen een dialoogvenster. Na het verzenden van het formulier wordt het dialoogvenster gesloten en wordt dialog.returnValue ingesteld op de waarde van de gebruikte verzendknop.

Bekijk de details met een live demo en polyfill .

Schakel dit in door 'Experimentele webplatformfuncties inschakelen' in te schakelen in chrome://flags/.