Last week, John showed a technique for enabling a popup anchor to degrade gracefully for users who do not have Javascript enabled. Inspired by his technique, I decided to throw together a jQuery plugin that implements this technique, without having the event attached inline.

It weighs in at just under 1k minified, so it shouldn’t be too tough on your page weight. Feel free to download it and use it for any kind of project.

Usage

Include the plugin as you would any jQuery plugin (where “/path/to/file” is specific to your instance).


Next, put the HTML markup in place (of course the href, target and class can be what you want):

Open Google in a new window.

Then, just call popup() on the desired elements:

$(".popup-link").popup();

Additionally, you can provide the desired size of the popup window like so:

$(".popup-link").popup({
    width: 320,
    height: 240
});

Download it here.

Update

We have posted a new version of the plugin that addresses a small bug. The download link above takes you to the demo/download page which contains the new version. Read more about it on this page.