学习啦>学习电脑>电脑硬件知识>键盘鼠标>

jS获取鼠标坐标、获取鼠标像素点

时间: 沈迪豪908 分享

  学前端的同学们你们知道怎么通过jS获取鼠标坐标、获取鼠标像素点吗?下面是学习啦小编收集整理关于通过jS获取鼠标坐标、获取鼠标像素点吗的资料以供大家参考学习,希望大家喜欢。

  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>

jS获取鼠标坐标、获取鼠标像素点相关文章:

1.js设置鼠标光标形状

2.js实现鼠标移到图片显示文字

3.使用js实现鼠标点击变色

1948890