Simple CSS/Sass animation for input fields.
A collection of checkbox animations made in CSS / Sass using the "Checkbox Hack". There is no Javascript used. The checkboxes use the element for their inputs and hide checkbox inputs due to their limited CSS support. By using a for attribute on the element, you tell the browser which label belongs which input.
Label Animations are created using the keyframe animations. Some also include the :before and :after pseudo elements of labels. These can be used in real world projects.
These checkboxes will work in all the major browsers:
⋅⋅* Google Chrome - [x] ⋅⋅* FireFox - [x] ⋅⋅* Internet Explorer - [x] ⋅⋅* Opera - [x] ⋅⋅* Safari - [x]
Download the CSS library
Link to the file within your project
Add a class to your element
Download the Sass library
Using the @import statement, import the Sass file into the Sass manifest file
Either @include and @extend in the element