Craig Francis

JS Linked Holder

If you need to have a box which the user can 'click', you can use this bit of unobtrusive JavaScript.


The box below demonstrates the linked holder. It effectively increases the hit area of the child link, which makes it act more like a banner.

This box is a homepage link, if JavaScript is enabled.

The code

First you need to download my script.js and linkedHolder.js files and include them in the pages <head>, like so:

<script type="text/javascript" src="scripts.js"></script>
<script type="text/javascript" src="linkedHolder.js"></script>

Then with your holder <div>, check that it contains only one link, and add the 'jsLinkedHolder' class, like so:

<div class="jsLinkedHolder">
<p>This box is a <a href="/">homepage</a> link.</p>

Dependancy note

You don't really need the full scripts.js file, as we only use the addLoadEvent and cssjs functions. But it does contain other functions which are handy to have lying around.

Any feedback would be greatly appreciated. If you would like to use this code, please read the licence it is released under.