DIV and OnMouseOver codes

chikadee · Joined: 24 Feb 2008 Posts: 1

so I am building a website, and I decided to test out a code before doing any major programming. Of course, it didn't work. I basically need a square covered in thumbnails of images, but then when the mouse is moved over a thumbnail the full-size image will show in that square (overtop of the thumbnails) until the mouse is moved off of the thumb.
right now, however, it will not work on mouseover, but needs to be clicked on and only shows while the mouse button is held. I am relatively new to DIV codes other than their use for alignment, but I think it might have something to do with layering? I got the code from here: http://www.technorealm.co.uk/scripts/mouseovershowtext.html and altered it to include my content, but as I was looking through the code I noticed there was no z-index within the DIV tag. Also, I know quite a bit about HTML but not very much about CSS, JavaScript, etc. Below is the code for the entire page, which you can view at this address: http://www.freewebs.com/tintedlens/ Any help would be appreciated!

Thanks!

<html>
<head>
<title>Photos.</title>
<script language="Javascript">

</script>
<style type="text/css">#div1, #div2, #div3 {position:absolute; top: 91; right: 91; visibility:hidden}</style>
</head>
<body bgcolor="FFFFFF">

<div id="link1" style="position: absolute; top: 100; right: 100;">
<a href="#" onMouseOver="toggleDiv('div1',1)" onMouseOut="toggleDiv('div1',0)"><img border="0" src="link1.jpg"/></a>
</div>
<div id="link2" style="position: absolute; top: 190; right: 100;">
<a href="#" onMouseOver="toggleDiv('div2',1)" onMouseOut="toggleDiv('div2',0)"><img border="0" src="link2.jpg"/></a>
</div>
<div id="link3" style="position: absolute; top: 280; right: 100;">
<a href="#" onMouseOver="toggleDiv('div3',1)" onMouseOut="toggleDiv('div3',0)"><img border="0" src="link3.jpg"/></a>
</div>

<div id="div1"><img border="0" src="image1.jpg"/></div>
<div id="div2"><img border="0" src="image2.jpg"/></div>
<div id="div3"><img border="0" src="image3.jpg"/></div>

</body>
</html>

sticks464 · Joined: 31 Dec 2006 Posts: 1172

Take a look here http://www.cssplay.co.uk/menu/, you'll probably find what you need.