Fancy Click Animations With jQuery And CSS3 - animateClick

File Size: 64.1 KB
Views Total: 2570
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Fancy Click Animations With jQuery And CSS3 - animateClick

animateClick is a lightweight jQuery plugin which brings 5 cool click animations to your elements when clicking/tapping, heavily based on CSS3 and SVG drawing animation.

How to use it:

1. Include the jQuery animateClick plugin in your page just before the end of body tag. Make sure you first have jQuery library installed.

<script src="jquery.min.js"></script>
<script src="animateClick.js"></script>

2. Create a default click animation on your element.

$('#btn').animateClick({
  "color":"black"
});

3. Change the animation type. The plugin currently comes with 5 animations:

  • default (ripple)
  • signal 
  • shoot 
  • tick 
  • cross
$('#btn').animateClick({
  "animation":"signal"
});

4. Override the default size of the click animation.

$('#btn').animateClick({
  "size": 10
});

About Author:

Author: Arun Thomas

Website: http://ajarunthomas.com/jquery/animateClick/


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