RAW said:
Can anyone tell me a simple way to make a picture rollover when the
mouseis over a particular piece of text?
Do you mean that you want the image to appear only when you mouseover, or do
you want it to remain?
This code will display an image on mouseover of the text, but it will
disappear when you mouseout.
<html>
<head>
<script language="JavaScript">
function hideit(elid)
{
var e = document.getElementById(elid).style
e.display = (e.display != 'block') ? "block" : "none"
}
function setImage(id,txt)
{ document.getElementById(id).innerHTML = txt }
</script>
</head>
<body>
<div id="layer1"
style="position: absolute; width: 100px; height: 25px;
z-index: 1; left: 200px; top: 30px;
font-family: verdana,arial,sans-serif;
font-size: 14px; font-color: black;
border: solid black 1px; display: none;">
</div>
<a href="#" onmouseover="hideit('layer1');setImage('layer1',
'<img src = \'images\\yellbox.gif\'>');"
onmouseout="hideit('layer1');">
Some English text</a>
</body>
</html>
BTW, position:absolute should be used with caution. In this case, it wil
work fine, but if you want the image to remain, you may be better off
placing the image in a table cell. (The code above needs to be amended in
order to retain the image after mouseout.)
