jQuery Plugin For Animated Custom Checkboxes & Radio Buttons - checkBo

jQuery Plugin For Animated Custom Checkboxes & Radio Buttons - checkBo
File Size: 25.5 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

checkBo is a jQuery plugin to create cross-browser & cross-platform checkboxes and radio buttons with animated check state powered by CSS3.

Advanced features:

  • Allows you to check all checkboxes by one click.
  • 4 CSS class based size options: Default, Small, Medium, Large.

Basic Usage:

1. Include jQuery library together with checkBo.css and checkBo.js into the document.

<link href="path/to/checkBo.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="path/to/checkBo.js"></script>

2. Insert a checkbox with a required CSS class 'cb-checkbox' into your document.

<label class="cb-checkbox">
  <input type="checkbox">
  Checkbox
</label>

3. You can custom the checkbox size by adding a CSS helper into your label element.

<label class="cb-checkbox cb-lg">
  <input type="checkbox">
  Checkbox
</label>

4. Call the plugin on the parent element and done.

$(document).ready(function(){
  $('form').checkBo();
});

Change log:

v0.1.3 (2014-10-06)

  • Improvements: Kill the bubbling on the click event ( link inside label ), Radio group toggle ( show hide ).

v0.1.2 (2014-10-06)

  • fix radio buttons animation in Safari
  • demo page update

v0.1.1 (2014-10-05)

  • update

This awesome jQuery plugin is developed by elmahdim. For more Advanced Usages, please check the demo page or visit the official website.