Animated Switch Control with jQuery and CSS3 - Checkbox Switcher
File Size: | 3.18 KB |
---|---|
Views Total: | 1928 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A dead simple jQuery plugin to convert a checkbox into a nice switch with labels that allows you to toggle an option by sliding the button left or right.
How to use it:
1. Load the jQuery library together with jQuery Checkbox Switcher's JS and CSS files in your web page.
<link rel="stylesheet" href="switcher.1.1.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script> <script src="jquery.switcher.1.1.js"></script>
2. Create a regular checkbox in the web page.
<input type="checkbox" id="checkbox_switcher" value="" name="checkbox_switcher">
3. Call the plugin on the checkbox and set the options for the switch control.
$(function(){ $("#checkbox_switcher").switcher({ switcher_on_Off : true, on_label: "Switcher On", off_label: "Switcher Off" }); });
This awesome jQuery plugin is developed by GigaDeveloper. For more Advanced Usages, please check the demo page or visit the official website.