function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}

var myimages=new Array()
var gotolink="#"

function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}


preloadimages("Easter/Heather.JPG","Easter/Hunting -Bunnies.JPG","Easter/Children_Colouring.JPG","Easter/Heather_and_hunter.JPG","Easter/102.JPG","Easter/101.JPG","Easter/103.JPG","Easter/Children_Colouring.JPG","Easter/100.JPG")
//Step 2: Insert the below HTML code to your web page where you wish the initial rollover image to be positioned:

//<a href="javascript:warp()"><img src="plane0.gif" name="targetimage" border=1></a>

//Step 3: Finally, you now need associate the rollover effect script with certain text or image links that will trigger the rollover effect when the mouse is moved over them (in the above demo, "Plane 1", "Plane 2" etc). Insert the below onMouseover event handler inside the <a> tag of these links, like below:

//<a href="BreakingandSchooling.html" onMouseover="changeimage(myimages[0],this.href)">