imgPreview demos

The 'imgPreview' plugin allows your users to preview an image before clicking on it and, out of necessity, will preload the image so when a user does click through to it there is no waiting time!

The image preview shows up in a tooltip-like box appearing alongside the user's cursor when hovering over a link. The plugin is entirely unobtrusive; it does not require any hooks to target specific links (no non-semantic classes); it will automatically detect the anchors that are linking to images and will only apply the preview effect to them.

There is now a screencast covering the creation of this plugin over here - the plugin has changed quite a bit since it's first version but it's still essentially the same.

JavaScript is required to view these demos.

Regular, no settings, no styles:

Hover over the links: (if the image doesn't show up straight away, don't worry, it's just loading)

Code:

$('ul#first a').imgPreview();