Με ολίγη javascript:
<html>
<head>
<title>Test</title>
<style>
div#rollover {
display: none;
position: absolute;
font-weight: bold;
font-family: courier;
font-size: 140%;
}
</style>
<script type="text/javascript">
function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
}
return [curleft,curtop];
}
function showText(offSets, theText) {
var rollover = document.getElementById("rollover");
rollover.style.left = offSets[0];
rollover.style.top = offSets[1];
rollover.style.display = "block";
rollover.innerHTML = theText;
}
function hideText() {
document.getElementById("rollover").style.display = "none";
}
</script>
</head>
<body>
<p>
<img src="http://www.adslgr.com/forum/images/header.gif"
alt="adslgr_logo" onMouseOver="showText(findPos(this), 'some text');"
onMouseOut="hideText();" />
</p>
<div id="rollover">
</div>
</body>
</html>
Βασικά τώρα πρέπει να φτιάξεις ένα background image για το rollover που να είναι ημιδιαφανές, και να ψάξεις να βρεις το width + height της εικόνας, για να το θέσεις στο rollover. Επίσης να μην ξεχάσεις να φτιάξεις το margin, ώστε το κείμενο να εμφανίζεται στο κέντρο.