Toggle Switch

Features

• Lightweight - 1.4kB minified/gzipped JS, 1kB minified/gzipped CSS
• Dependency free
• Works with mobile browsers, including swiping support
• Chrome, Firefox, Safari, IE9+

Usage

Toggle Switches utilise a checkbox element defined in HTML. The class attribute defines how the toggle switch will be displayed (combinations are "blue", "orange", "blue small", "orange small")

<input type="checkbox" class="blue small" id="toggle" />

The ToggleSwitch class accepts the checkbox element along with the on and off text, like so:

var checkbox = document.getElementById('toggle');
var switch = new ToggleSwitch(checkbox, 'ON', 'OFF');
switch.on();

Source Code