I am trying to get several text lines (which when the cursor passes over) loads an individual picture in a fixed location above the text. There will be 7 total individual lines of information that will load an individual picture of said line with a different picture. Is there a way to do this?

I have included the javascript that I worked on but cannot seem to have the images load properly. i keep getting syntax errors. Any help would be appreciated.

<script>
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}
</script>
<script language="JavaScript1.1">
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("pic1.jpg", "pic2.jpg", "pic3.jpg", "pic4.jpg", "pic5.jpg", "pic6.jpg", "pic7.jpg")

<script>

<a href="pic1.htm" onMouseover="changeimage(myimages[pic1.jpg],this.href)">Pic 1</a>
<a href="pic2.htm" onMouseover="changeimage(myimages[pic2.jpg],this.href)">Pic 2</a>
<a href="pic3.htm" onMouseover="changeimage(myimages[pic3.jpg],this.href)">Pic 3</a>
<a href="pic4.htm" onMouseover="changeimage(myimages[pic4.jpg],this.href)">Pic 4</a>
<a href="pic5.htm" onMouseover="changeimage(myimages[pic5.jpg],this.href)">Pic 5</a>
<a href="pic6.htm" onMouseover="changeimage(myimages[pic6.jpg],this.href)">Pic 6</a>
<a href="pic7.htm" onMouseover="changeimage(myimages[pic7.jpg],this.href)">Pic 7</a>


</script>