JavaScript实现捕获鼠标坐标


Posted in Javascript onApril 12, 2020

本文实例为大家分享了JavaScript实现捕获鼠标坐标的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>事件对象</title>
 <style>
  .box1{
   width: 300px;
   height: 100px;
   border: 1px solid #000;
  }
  .box2 {
   width: 150px;
   height: 50px;
   border: 1px solid #000;
   margin-top: 50px;
   padding-top: 10px;
   box-sizing: border-box;
   text-align: center;
  }
 </style>
 <script>
  window.onload = function () {
   var box1 = document.getElementsByTagName("div")[0];
   var box2 = document.getElementsByTagName("div")[1];
   box1.onmousemove = function (event) {
    // 解决IE的兼容性问题
    event = event || window.event;
    box2.innerHTML = "X:" + event.clientX + " Y: " + event.clientY;
   }
  };
 </script>
</head>
<body>
 <div class="box1"></div>
 <div class="box2"></div>
</body>
</html>

JavaScript实现捕获鼠标坐标

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js播放wav文件(源码)
Apr 22 Javascript
extjs 如何给column 加上提示
Jul 29 Javascript
js实现匹配时换色的输入提示特效代码
Aug 17 Javascript
常用的Javascript设计模式小结
Dec 09 Javascript
JS中的二叉树遍历详解
Mar 18 Javascript
Window.Open打开窗体和if嵌套代码
Apr 15 Javascript
JS添加删除DIV的简单实例
Jul 08 Javascript
canvas实现简易的圆环进度条效果
Feb 28 Javascript
ES6 javascript中class静态方法、属性与实例属性用法示例
Oct 30 Javascript
JavaScript数组去重的方法总结【12种方法,号称史上最全】
Feb 28 Javascript
JavaScript实现简单计时器
Jun 22 Javascript
vue的项目如何打包上线
Apr 13 Vue.js
jquery实现轮播图特效
Apr 12 #jQuery
用jQuery实现抽奖程序
Apr 12 #jQuery
javascript实现画板功能
Apr 12 #Javascript
JS实现随机点名器
Apr 12 #Javascript
微信小程序实现抖音播放效果的实例代码
Apr 11 #Javascript
JS中间件设计模式的深入探讨与实例分析
Apr 11 #Javascript
js防抖函数和节流函数使用场景和实现区别示例分析
Apr 11 #Javascript
You might like
php中文本数据翻页(留言本翻页)
2006/10/09 PHP
不重新编译PHP为php增加openssl模块的方法
2011/06/14 PHP
PHP缓存集成库phpFastCache用法
2014/12/15 PHP
PHP的自定义模板引擎
2017/03/24 PHP
php删除二维数组中的重复值方法
2018/03/12 PHP
PHP实现浏览器中直接输出图片的方法示例
2018/03/14 PHP
JavaScript脚本性能优化注意事项
2008/11/18 Javascript
javascript 学习之旅 (3)
2009/02/05 Javascript
Javascript 文件夹选择框的两种解决方案
2009/07/01 Javascript
JavaScript 全角转半角部分
2009/10/28 Javascript
Javascript的匿名函数小结
2009/12/31 Javascript
用js+iframe形成页面的一种遮罩效果的具体实现
2013/12/31 Javascript
js控制iframe的高度/宽度让其自适应内容
2014/04/09 Javascript
JavaScript indexOf方法入门实例(计算指定字符在字符串中首次出现的位置)
2014/10/17 Javascript
jquery实现可关闭的倒计时广告特效代码
2015/09/02 Javascript
js实现拖拽效果(构造函数)
2015/12/14 Javascript
NodeJS的Promise的用法解析
2016/05/05 NodeJs
用js写的一个路由(简单实例)
2016/09/24 Javascript
js滚轮事件兼容性问题需要注意哪些
2016/11/15 Javascript
Vuex利用state保存新闻数据实例
2017/06/28 Javascript
vue实现手机号码抽奖上下滚动动画示例
2017/10/18 Javascript
基于node搭建服务器,写接口,调接口,跨域的实例
2018/05/13 Javascript
JS中使用cavas截图网页并解决跨域及模糊问题
2018/11/13 Javascript
Javascript迭代、递推、穷举、递归常用算法实例讲解
2019/02/01 Javascript
如何使用pm2快速将项目部署到远程服务器
2019/03/12 Javascript
vue-cli随机生成port源码的方法
2019/09/02 Javascript
python九九乘法表的实例
2017/09/26 Python
windows下cx_Freeze生成Python可执行程序的详细步骤
2018/10/09 Python
python算法与数据结构之单链表的实现代码
2019/06/27 Python
django-xadmin根据当前登录用户动态设置表单字段默认值方式
2020/03/13 Python
Django --Xadmin 判断登录者身份实例
2020/07/03 Python
Python实现GIF图倒放
2020/07/16 Python
WoolOvers爱尔兰:羊绒、羊毛和棉针织品
2017/01/04 全球购物
电子商务专业毕业生工作推荐信
2013/11/17 职场文书
4S店售后客服自我评价
2014/04/09 职场文书
郭明义电影观后感
2015/06/08 职场文书