本文實例講述了JS獲取鼠標位置距瀏覽器窗口距離的方法。分享給大家供大家參考，具體如下：
先來看看運行效果圖：
代碼如下：
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title><style type="text/css">#test_div { width:400px; height: 400px; background-color: red;}</style> </head> <body> <div id="test_div"></div> </body><script type="text/javascript"> function mousePos(e){ e=e||window.event; var scrollX=document.documentElement.scrollLeft||document.body.scrollLeft;//分別兼容ie和chrome var scrollY=document.documentElement.scrollTop||document.body.scrollTop; var x=e.pageX||(e.clientX+scrollX);//兼容火狐和其他瀏覽器 var y=e.pageY||(e.clientY+scrollY); console.log(x,y); return {x:x,y:y}; } var test=document.querySelector("#test_div"); test.onclick=function(e){ mousePos(e); }</script></html>其中的document.documentElement.scrollLeft和document.body.scrollLeft分別是ie和chrome的方法，而火狐中的pageX可以直接獲取滑動的距離。
PS：這里再為大家提供兩款在線參考表工具供大家開發過程中參考使用：
javascript事件與功能說明大全：
http://tools.VeVB.COm/table/javascript_event
鍵盤與鼠標按鍵的鍵值對照表：
http://tools.VeVB.COm/table/key_codes_num
更多關于JavaScript相關內容感興趣的讀者可查看本站專題：《JavaScript事件相關操作與技巧大全》、《JavaScript窗口操作與技巧匯總》、《JavaScript中json操作技巧總結》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
新聞熱點
疑難解答
