鼠标划到图片上方弹出一个大图片

Question

有这样一个需求　页面中有5行5列整齐排列的小图片　现在需要实现当鼠标划到任意一个图片上的时候　在这个图片右上角（当然也可以是其它位置,只要相对位置固定）弹出一个显示详细信息的框　划出就消失　这个功能怎么实现　关键是要得到图片的什么坐标　弹出框弹出的语句怎么写

Answer 1

http://host.sonspring.com/hoverbox/
请查看源代码

Answer 2

<style>
#bigPic {display:none;position:absolute;z-index:999;}
img {border:black solid 1px;} /* 为了清楚,显示图片边框 */
</style><SCRIPT>
function tipHide(){ document.getElementById("bigPic").style.display="none";}
function tipShow(img){
var o=document.getElementById("bigPic")
o.src=img.src;
o.style.left=img.offsetLeft+img.width+50;//稍微向右偏离一些，便于移到右边的其它图片
o.style.top=img.offsetTop-img.height;
o.style.display="block";
}
</SCRIPT>
<div style="height:300px;">撑起来</div><img src="http://www.baidu.com/img/lm.gif" width="200" height="200" onmouseover="javascript:tipShow(this);" onmouseout="javascript:tipHide();">
<img src="http://www.google.com.hk/images/srpr/nav_logo14.png" width="200" height="200" onmouseover="javascript:tipShow(this);" onmouseout="javascript:tipHide();">
<img id="bigPic" width="500" height="500">

Answer 3

把你的哪个大图片用一个DIV层来装好，页面加载隐藏掉，然后处理鼠标的Onmouseover（鼠标移入 显示）和onmouseout(鼠标移出 隐藏) 是你哪个小图片的哈