я вот так обычно делаю
<!DOCTYPE html>
<html>
<head>
<style>
#floatTip
{
position: absolute; width: 250px;
display: none; border: 1px solid #000; padding: 5px;
font-family: sans-serif; font-size:9pt;color: #931;
background: red;opacity: 0.85;
z-index:2000;left:0;
}</style>
<script>
var pr=0;
function f(){pr=1};
function f1(){pr=0;var f=document.getElementById('floatTip');f.style.display='none';};
function f3(e){if(pr!=1)return;
var f=document.getElementById('floatTip');f.style.display='block';
f.style.top=(e.pageY+10)+'px';
f.style.left=(e.pageX-125)+'px';
};
</script>
<body onmousemove=f3(event)>
<div id='floatTip'
></div><img width=200 onmouseover=f(event) onmouseout=f1(event) src='http://all-html5.narod.ru/2/1.jpg'>