<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
#im{position: absolute;}
</style>
</head>
<body>
<img src="timg1.jpg" id="im">
<script type="text/javascript">
var imobj=document.getElementById("im");
//兼容代码 IE8没有事件参数对象 undefined 火狐谷歌有e
var evt={
getEvent:function(evt){
return evt=window.event||evt;
},
getClientX:function(evt){ //可视区域的左边距离
return this.getEvent(evt).clientX;
},
getClientY:function(evt){ //可视区域的上边距离
return this.getEvent(evt).clientY;
},
getScrollX:function(){ //向左卷曲出去的距离
return window.pageXOffset||document.documentElement.scrollX||document. body.scrollX||0;
},
getScrollY:function(){ //向上卷曲出去的距离
return window.pageYOffset||document.documentElement.scrollY||document.
body.scrollY||0;
},
getPageX:function(evt){ //鼠标相对页面边界的距离pageX pageY 火狐谷歌支持 IE8不支持 IE8用 可视页面距离+卷曲出去的距离来实现
return this.getEvent(evt).pageX?this.getEvent(evt).pageX:this.getEvent(evt).getClientX+this.getEvent(evt).getScrollX;
},
getPageY:function(evt){
return this.getEvent(evt).pageY?this.getEvent(evt).pageY:this.getEvent(evt).getClientY+this.getEvent(evt).getScrollY;
}
}
document.οnmοusemοve=function(e) //事件参数对象
{
imobj.style.left=evt.getPageX(e)+"px";
imobj.style.top=evt.getPageY(e)+"px";
}
</script>
</body>
</html>
timg1.jpg