Demo: Modal Dialog Component

Click the button to open the modal. The button has the class "trigger". The modal is closed by default.

Page content

This is the page behind the modal. When the modal opens, focus will be trapped inside it and this content will be hidden from assistive technologies.

Try tabbing through focusable elements to see focus trapping in action once the modal is open.

A sample link