具体用法是这样的：
将Javascript代码放到</body>前（将脚本代码放在页面底端有助于提高页面速度，但是我现在还没有切身的体会）
复制代码 代码如下:
<script language=JavaScript>
function mouseOutPic()//当鼠标移出时，隐藏原图
{
if(window.event.toElement.id!="img000") bigPic.style.visibility = "hidden";
//如果鼠标不在img000上的话，将这个区域隐藏
}
function mouseOverPic(imgSrc)//当鼠标移上小图时，显示原图
{
var seeBig = document.getElementById("bigPic");//得到将要显示原图区域的div element
var newImg = document.createElement("img");//新建一个img element，将原图的src赋给这个element
newImg = "<img src='" + imgSrc + "'/>";//注意这里，是为整个element赋值，我在这个小问题上还花了挺多时间
//alert(imgSrc);
seeBig.innerHTML = newImg;//将原图赋给要显示的区域
}
</script>
下面是HTML代码：
复制代码 代码如下:
<>
<>
<>
<img id="img000" src="images/general/emailAt.jpg" onmouseover="mouseOverPic('images/general/usc_badge.jpg'); bigPic.style.visibility='visible'" onmouseout="mouseOutPic()">
<>
<div id="bigPic">
</div>
上面这个代码没有控制原图出现的位置，如果涉及到靠近窗口边缘的位置的话会用到offsetLeft等属性。
仔细想想，其实这个也蛮简单的。写Javascript的需要多多注意细节，这个实在是太重要了，一不小心就会出错，最糟糕的是不知道错在哪里。
【javascript 鼠标悬浮图片显示原图 移出鼠标后原图消失（多图）】相关文章：
★ JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法