Toggle
Toggles are radio button for actions, also showing selection status.
Toggle
<input class="e-buttonradio" type="checkbox" value="1" name="buttoncheckbox" id="buttoncheckbox-1">
<label class="e-btn" for="buttoncheckbox-1">
Button 1
</label><input class="e-buttonradio" type="checkbox" value="1" name="buttoncheckbox" id="buttoncheckbox-1">
<label class="e-btn" for="buttoncheckbox-1">
Button 1
</label>JavaScript
Usage
Toggle (button group)
<div class="e-buttongroup e-buttongroup-sticky">
<input class="e-buttonradio" type="radio" value="1" name="buttonradio" id="buttonradio-1">
<label class="e-btn" for="buttonradio-1">
Button 1
</label>
<input class="e-buttonradio" type="radio" value="2" name="buttonradio" id="buttonradio-2">
<label class="e-btn" for="buttonradio-2">
Button 2
</label>
<input class="e-buttonradio" type="radio" value="3" name="buttonradio" id="buttonradio-3">
<label class="e-btn" for="buttonradio-3">
Button 3
</label>
</div><div class="e-buttongroup e-buttongroup-sticky">
<input class="e-buttonradio" type="radio" value="1" name="buttonradio" id="buttonradio-1">
<label class="e-btn" for="buttonradio-1">
Button 1
</label>
<input class="e-buttonradio" type="radio" value="2" name="buttonradio" id="buttonradio-2">
<label class="e-btn" for="buttonradio-2">
Button 2
</label>
<input class="e-buttonradio" type="radio" value="3" name="buttonradio" id="buttonradio-3">
<label class="e-btn" for="buttonradio-3">
Button 3
</label>
</div>JavaScript