Toggler

Toggler allows you to create very simple toggles/switches with minimal js. I made it whilst working @ Glider.

Requirements

jquery

Examples

http://cam-stitt.github.io/toggler/

Installing

Toggler can be installed through bower:

bower install toggler

Usage

Toggler is easy to use. Simply call toggler() on a checkbox input.

<input type="checkbox" class="toggled">

$(".toggled").toggler();

Configuration Options

There are also configuration options to override the default values for Toggler:

Initial State

<input type="checkbox" data-initial-state="true" class="toggled">
<input type="checkbox" data-initial-state="false" class="toggled">

Labels

<input type="checkbox" data-left-label="on" data-right-label="off" class="toggled">

Classes

You can add your own custom classes. Here is an example using Bootstrap btn-group:

<input type="checkbox" data-left-class="btn btn-success" data-right-class="btn btn-danger" data-wrap-class="btn-group" class="toggled">

Through JS

$(".toggled").toggler({
  "leftLabel": "Yes Please",
  "rightLabel": "No Thanks",
  "initialStat": true
  "leftClass": "btn btn-success",
  "rightClass": "btn btn-danger",
  "wrapClass": "btn-group"
});

Toggler is a new project and there will be more features added over time. Some of these features include:

• Reverse order of toggles (optionally make 'off' first)