Simple Toggle Switch Plugin With jQuery And Bootstrap - Bootstrap Switch
| File Size: | 4.34 KB |
|---|---|
| Views Total: | 26119 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
A minimalist jQuery plugin that converts normal checkboxes into highly customizable toggle switches using Bootstrap styles.
How to use it:
1. Add the JavaScript file bootstrap-switch.js into your Bootstrap project.
<script src="bootstrap-switch.js" ></script>
2. Create a regular checkbox for the toggle switch.
<input type="checkbox" name="checkbox1">
3. Remember set you events before call bootstrapSwitch or they will fire after bootstrapSwitch's events.
$("[name='checkbox1']").change(function() {
if(!confirm('Do you wanna cancel me!')) {
this.checked = true;
}
});
4. Call the bootstrapSwitch function and done.
$("[name='checkbox1']").bootstrapSwitch();
5. Customization options with default values.
$("[name='checkbox1']").bootstrapSwitch({
on: 'On',
off: 'Off ',
onLabel: ' ',
offLabel: ' ',
same: false,//same labels for on/off states
size: 'md',
onClass: 'primary',
offClass: 'default'
});
This awesome jQuery plugin is developed by wpic. For more Advanced Usages, please check the demo page or visit the official website.











