scottaohara / a11y_switch_web_component

ARIA Switch control web component

Switch web component

An example of switch controls (role=switch) built as a web component.

I'm sure this could be better, so PRs are welcome :)

Available attributes

• labelled-state:
  If set, will display "On" and "Off" text labels in toggle UI.
• check:
  If set, will default to "on / checked" state. Otherwise will default to "off / unchecked".
• disable:
  If set, will default to disabled state.

Example on CodePen

Screen Reader Quirks

Please review the breakdown of screen reader issues with role="switch". While this particular link goes to an example of using role=switch on a checkbox, the same issues occur if using role=switch on a button element as well, as this web component does.

License & Such

This script was written by Scott O'Hara.

It has an MIT license.

Do with it what you will :)