There are a few ways to do this, and it depends really on how you want to, but the simplest assumption is that you are just changing the src attribute of your image right? So you want something which will read this, and send you to the correct place.
Assuming you have preloaded your images in an array, why not try something like this:
Object.prototype.URL;
var images = new Array();
images[0] = new Image(200,100);
images[0].src = "someImage.gif";
images[0].URL = "someURL.com";
This way, all of the images have a property which can be queried - to find out where to send the user to. Now, when you change the src of the displaying image though - if you queried this one - you'd get a error.So you need a simple comparing loop to find out which one is displaying:
This function compares the src of the currently displaying image with those in the preload array. It finds which one it is then gets the appropriate URL value.
function sendTo(displayImage){
for(var j=0;j<images.length;j++){
if (images[j].src == displayImage.src){
//we have a match so send them to the URL
document.location = images[j].URL;
}
}
}
Ofcourse you could have an if/else statement, like if the src is this, then do that - or equivalently a switch, but this explores a few different things your tutor may like ;-) Something else might be like:
<img src="something.gif" URL="someURL.com" ../>
and then simply change the URL value at the same time as yu change the src - then you can get it without going to to the array.
b2 - benbiddington@surf4nix.com