1. 程式人生 > >鼠標跟著鍵盤飛=====兼容代碼

鼠標跟著鍵盤飛=====兼容代碼

abs gets off || ans 鼠標 向上 跟著 absolute

<style>
img{
position: absolute;
}
</style>
</head>
<body>
<img src="imgs/tianshi.gif" id="im">
<script src="../DOM/commer.js"></script>
<script>
// document.onmousemove=function (e) { //IE8支持:window.event
// ver("im").style.left=e.clientX+"px";
// ver("im").style.top=e.clientY+"px";
// };

//兼容代碼
//把代碼放在一個對象中
var evt={
//window.event和事件參數對象e的兼容
getEvent:function (evt) {
return window.event||evt;
},
//可視區域橫坐標的兼容代碼
getClientX:function (evt) {
return this.getEvent(evt).clientX;
},
//可視區域縱坐標的兼容代碼
getClientY:function (evt) {
return this.getEvent(evt).clientY;
},
//頁面向左卷曲出去的橫坐標
getScrollLeft:function () {
return window.pageXOffset||document.body.scrollLeft||document.documentElement.scrollLeft||0;
},
//頁面向上卷曲出去的縱坐標
getScrollTop:function () {
return window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop||0;
},

//相對於頁面的橫坐標(pageX或者是clientX+scrollLeft)
getPageX:function (evt) {
return this.getEvent(evt).pageX?this.getEvent(evt).pageX:this.getClientX(evt)+this.getScrollLeft();
},
//相對於頁面的縱坐標(pageY或者是clientY+scrollTop)
getPageY:function (evt) {
return this.getEvent(evt).pageY?this.getEvent(evt).pageY:this.getClientY(evt)+this.getScrollTop();
}
};


//測試===================================================================
document.onmousemove=function (e) { //IE8支持:window.event
ver("im").style.left=evt.getPageX(e)+"px";
ver("im").style.top=evt.getPageY(e)+"px";
};
</script>

鼠標跟著鍵盤飛=====兼容代碼