Subtle Wiggle/Shake Animation In jQuery - wiggle.js

wiggle.js is an ultra-light (700 bytes minified) jQuery plugin that enables you to apply a configurable Wiggle (Shake) animation to relatively-positioned elements using jQuery's animate() method.

How to use it:

1. Download and insert the minified version of the wiggle.js plugin after loading the latest jQuery library.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/src/jquery.wiggle.min.js"></script>

2. Enable the Wiggle animation on the element you specify.

<div class="box">
  Wiggle.js Demo
</div>

$(function(){
  $(".box").wiggle();
});

3. Set the animation speed. Default: 50.

$(function(){
  $(".box").wiggle({
    speed: 100
  });
});

5. Set the number of times to wiggle. Default: 3.

$(function(){
  $(".box").wiggle({
    wiggles: 5
  });
});

6. Set the number of pixels to move. Default: 5.

$(function(){
  $(".box").wiggle({
    travel: 10
  });
});

7. Trigger a function when the animation finishes.

$(function(){
  $(".box").wiggle({
    callback: function(){
      // do something
    }
  });
});

---

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