jQuery Cursor Hover Plugin

This plugin lets you create a two-layer button with one layer that follows the mouse. This method allows you to create some very professional effects on your site. The example below duplicates the Windows 7 start bar button hover functionality.

Demo

This is a link

Implementation

outerImage (string - image location):

This image will stay in the same place

innerImage (string - image location):

This image will follow your mouse

fadeSpeed (integer):

This is the speed the innerImage fades in and out on hover

innerBorder (integer):

This is the amount of space inside the outerImage. The example above has the innerBorder set to 1

align (string - preset values):

This is the alignment of the innerImage to the outerImage. Possible values are: top, center, bottom

zalign (string - preset values):

This determines the z position of the innerImage. Possible values are top, which puts the image that follows the mouse on top of the static image, and bottom, which puts it underneath.

New in version 0.8 (06/14/2010)

How to link:

Add an <a> tag inside the button div. The script will wrap the top image in the link tag and will also keep the text the link linked to, but will hide it (height:0px).