<div id="wrapper"><img src="http://images.cnblogs.com/cnblogs_com/rain-null/1038612/o_33.jpg" alt="ss"/>

<img  id="hh"src="http://images.cnblogs.com/cnblogs_com/rain-null/1038612/o_33.jpg" alt="ss"/>

</div>

<style>

div{width:500px;height:400px;margin:0 auto;border:1px solid red;position:relative}

img:nth-child(1){position:absolute;left:0;top:0;}

 img:nth-child(2){position:absolute;width:300px;height:200px;display:none;}

</style>

<script>

    document.images[0].onmousemove=function(){

    var hh=document.getElementById("hh");

    var x=event.offsetX;

    var y=event.offsetY;

        hh.style.display="block";

        hh.style.left=x+50+"px";

        hh.style.top=50+y+"px";

    };

    document.images[0].onmouseout=function(){hh.style.display="none";}

</script>