鼠标放在一个连接上,会显示图片(类似tooltip)

<body>
<a href="www.sina.com" id="i" onmouseover="show(this)" onmouseout="hide()">免费电影</a>
<div id="m" style="BORDER-RIGHT:black 1px solid;PADDING-RIGHT:20px;BORDER-TOP:black 1px solid;PADDING-LEFT:20px;Z-INDEX:100;VISIBILITY:hidden;PADDING-BOTTOM:20px;BORDER-LEFT:black 1px solid;WIDTH:80px;PADDING-TOP:20px;BORDER-BOTTOM:black 1px solid;POSITION:absolute"
onmouseover="show(i)" onmouseout="hide()">
<img src="meng.jpg"></img>
</div>
<script> 
function  show(o){ 
var  m=document.getElementById("m") 
m.style.pixelLeft=getL(o) 
m.style.pixelTop=getT(o)+o.offsetHeight 
m.style.visibility='' 

 
function  hide(){ 
document.getElementById("m").style.visibility='hidden' 

 
function  getL(e){ 
var  l=e.offsetLeft; 
while(e=e.offsetParent){ 
l+=e.offsetLeft; 

return  l 

 
function  getT(e){ 
var  t=e.offsetTop; 
while(e=e.offsetParent){ 
t+=e.offsetTop; 

return  t 

</script>
</body>

原文地址:https://www.cnblogs.com/asia/p/1448649.html