欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS獲取鼠標(biāo)位置距瀏覽器窗口距離的方法示例

 更新時(shí)間：2017年04月11日 11:09:59   作者：布瑞澤的童話  
這篇文章主要介紹了JS獲取鼠標(biāo)位置距瀏覽器窗口距離的方法,結(jié)合實(shí)例形式分析了JS針對各種常見瀏覽器窗口及鼠標(biāo)響應(yīng)操作相關(guān)技巧,需要的朋友可以參考下

本文實(shí)例講述了JS獲取鼠標(biāo)位置距瀏覽器窗口距離的方法。分享給大家供大家參考，具體如下：

先來看看運(yùn)行效果圖：

代碼如下：

<!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可以直接獲取滑動(dòng)的距離。

PS：這里再為大家提供兩款在線參考表工具供大家開發(fā)過程中參考使用：

javascript事件與功能說明大全：
http://tools.jb51.net/table/javascript_event

鍵盤與鼠標(biāo)按鍵的鍵值對照表：
http://tools.jb51.net/table/key_codes_num

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript事件相關(guān)操作與技巧大全》、《JavaScript窗口操作與技巧匯總》、《JavaScript中json操作技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評論