jQuery.animatedBorder.js

Instructions

The animated border method toggles animated borders on an element. To apply animated borders to an elements:


$('div.alpha').animatedBorder({size : 1, color : 'red'});

Apply it again to remove the borders:


$('div.alpha').animatedBorder();

The plugin accepts a configuration object. You can specify a background color, and the size of the border.


options = {
  size: 2,
  color: '#6699CC'
  }

Background patterns are not handled with the default stripe.gif file. The plugin uses the the background color of the divs to make the border color. This means that the non-transparent area of the checkerboard has to match the background color of the page for the illusion to work. If you had a page with surrounding elements under the border, or you had a non white background, you should create a new animated gif with blocks that are transparent and the desired border color.