Captures boolean input with an optional indeterminate mode.
Usage
Want ice cream?
Want ice cream?
Sizes
Here are several predefined toggle sizes, each serving its own semantic purpose.
Large
Medium
States
Disabled
Make input look inactive by adding the disabled boolean
attribute to any
<input>
element.
Disabled toggle
Disabled toggle
Disabled toggle
Disabled toggle
Readonly
Make input look inactive by adding the disabled boolean
attribute to any
<input>
element.
Readonly toggle
Readonly toggle
Readonly toggle
Readonly toggle
Events
On change of toggle value a CustomEvent goat:change
is
triggered by the element.
Change Event?
document.querySelector('#change-toggle-field').addEventListener('goat:change', function(event) {
console.log('Input changed to :: ' + event.target.value);
});