Random image link
4th November 2004
Reload the page to see another random choice.
It's really just another random banner script, but crucially, it still
provides content to unsupported browsers, without reliance on the
<noscript> paradigm -
if scripting (or this script) is not supported, the default
alt text will always be shown.
Get the script
Download the zipfile [12K], unzip it into your site
directory and include the script on your page -
it should go in the
<body> section, after the
link(s) you want to change, for example:
The link is just a regular image link, with a unique
id to identify it
to the script. Once that's in place, the rest of
the configuration is inside
near the top of the script, where it says
Define image links.
Begin by creating a new image link object,
id of your link:
//identify an image link ('link-id') var button = new imageLink('udm-button');
Then define each of the possible choices for that link.
There are six properties for each choice,
all of which are required, although if you don't want
title text you can set that as an empty string:
//add possibilities ('href', 'title text', 'src', 'width', 'height', 'alt text') button.addLink('http://www.udm4.com/', 'Default page', 'buttons/udm4-button88x31.gif', '88', '31', 'Accessible Website Menu [default]');
You can go on to add as many choices as you like:
button.addLink('http://www.udm4.com/?page=green', 'Green page', 'buttons/udm4-greenbutton88x31.gif', '88', '31', 'Accessible Website Menu [green]'); button.addLink('http://www.udm4.com/?page=red', 'Red page', 'buttons/udm4-redbutton88x31.gif', '88', '31', 'Accessible Website Menu [red]'); button.addLink('http://www.udm4.com/?page=purple', 'Purple page', 'buttons/udm4-purplebutton88x31.gif', '88', '31', 'Accessible Website Menu [purple]'); button.addLink('http://www.udm4.com/?page=blue', 'Blue page', 'buttons/udm4-bluebutton88x31.gif', '88', '31', 'Accessible Website Menu [blue]'); button.addLink('http://www.udm4.com/?page=black', 'Black page', 'buttons/udm4-blackbutton88x31.gif', '88', '31', 'Accessible Website Menu [black]'); button.addLink('http://www.udm4.com/?page=white', 'White page', 'buttons/udm4-whitebutton88x31.gif', '88', '31', 'Accessible Website Menu [white]');
Finally, once all the choices are defined, it only remains to select one and change the link, using this function call:
//select a possibility at random button.selectLink();
And that's all there is to it
If you want to run the script over additional image links,
simply repeat this code again,
"button" for a new variable name, and
id of the new link. You can go on to create
as many instances as you like; such is the beauty of
The script doesn't need a
because it doesn't modify any document-level properties, nor require
the default image to have finished loading.
But if it's to work, the
<script> include for
must always come after the links themselves.
It doesn't have to be directly after, just after.