PDA

Click to See Complete Forum and Search --> : Help With Rolling Over Images

kitora18
12-01-2002, 05:29 AM
Hello All,

I'm doing a project and I am hoping that someone can help me out.

I plan to have about 6 - 8 images. I want to arrange them in shape, preferably a circle, but I don't mind and as I roll the mouse over each one I want text to display in the center of the images.

Something similar to this

http://tw.tmphosting.com/c2c.html

Thanks you so much. Hope to hear from somebody soon.
Zach Elfers
12-01-2002, 02:09 PM
You would have to position the images with CSS to make them in a circle like you want. You could do this like this:

<style type="text/css">

img {
position:absolute;
top:50px;
left:20px;
}

</style>

You would have to change the pixel value to whatever you want to make it look right.

The thing where the text appears in the center could probably be done this way.

<head>
<script language="JavaScript" type="text/JavaScript">
<!-- Begin

function changeMenu(currMenu) {
if (document.getElementById) {
thisMenu = document.getElementById(currMenu).style
if (thisMenu.display == "block") {
thisMenu.display = "none"
}
else {
thisMenu.display = "block"
}
return false
}
else {
return true
}
}

// End -->
</script>
</head>

<body>

<img src="img1.gif" name="img1" onMouseOver="return changeMenu('menu1');" onMouseOut="return changeMenu('menu1');">

<img src="img2.gif" name="img2" onMouseOver="return changeMenu('menu2');" onMouseOut="return changeMenu('menu2');">

<center>
<div id="menu1" style="display:none;">

Text for the center

</div>
<div id="menu2" style="display:none;">

Text for the center

</div>
</center>
</body>
kitora18
12-01-2002, 07:33 PM
Hello

Your a genius, thanks for your help. There's two problems, the pictures are overlapping instead of going in a circle and the text is displaying in the center of the page instead of the center of the circle.

Thanks again for your help. I don't mean to bother you.


Kitora
Zach Elfers
12-02-2002, 04:26 PM
I emailed you the answer after you emailed me.:)