您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

JS获取鼠标坐标、获取鼠标像素点示例

作者:佚名    责任编辑:admin    更新时间:    2015-10-15 10:09:30

 运行代码之后随意移动鼠标的位置,可适时显现鼠标的坐标点,不占用系统资源

JS获取鼠标坐标,获取鼠标像素点的典型实例,运行本页面后,随意移动鼠标的位置,可适时显现鼠标的坐标点,不占用系统资源 。    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">  <head>  <title>JavaScript获取鼠标坐标</title>  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  <style type="text/css">  .tip {  width:200px;  border:2px solid #ddd;  padding:8px;  background:#f1f1f1;  color:#666;  }  </style>  <script type="text/javascript">  function mousePos(e){  var x,y;  var e = e||window.event;  return {  x:e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft,  y:e.clientY+document.body.scrollTop+document.documentElement.scrollTop  };  };  function test(e){  document.getElementById("mjs").innerHTML = mousePos(e).x+','+mousePos(e).y;  };  </script>  </head>  <body>  <div id="mjs" class="tip">源码爱好者</div>  <div id="test" style="width:1000px;height:1000px;background:#ccc;" onmousemove="test(event)"></div>  </body>  </html>      [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行