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 相关文章推荐
slice函数的用法 之不错的应用
Dec 29 Javascript
根据分辩率调用不同的CSS.
Jan 08 Javascript
Aptana调试javascript图解教程
Nov 30 Javascript
返回上一页并自动刷新的JavaScript代码
Feb 19 Javascript
自己实现ajax封装示例分享
Apr 01 Javascript
当某个文本框成为焦点时即清除文本框内容
Apr 28 Javascript
js实现精美的银灰色竖排折叠菜单
May 16 Javascript
Javascript中类式继承和原型式继承的实现方法和区别之处
Apr 25 Javascript
详解CommonJS和ES6模块循环加载处理的区别
Dec 26 Javascript
jQuery+ajax实现批量删除功能完整示例
Jun 06 jQuery
Vue在chrome44偶现点击子元素事件无法冒泡的解决方法
Dec 15 Javascript
原生JS实现分页
Apr 19 Javascript
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
ftp类(myftp.php)
2006/10/09 PHP
PHP 函数执行效率的小比较
2010/10/17 PHP
zf框架的registry(注册表)使用示例
2014/03/13 PHP
PHP遍历文件夹与文件类及处理类用法实例
2014/09/23 PHP
php页面函数设置超时限制的方法
2014/12/01 PHP
php pdo操作数据库示例
2017/03/10 PHP
PHP获取二叉树镜像的方法
2018/01/17 PHP
PHP+Redis开发的书签案例实战详解
2019/07/09 PHP
JavaScript中将一个值转换为字符串的方法分析[译]
2012/09/21 Javascript
利用jquery包将字符串生成二维码图片
2013/09/12 Javascript
关于JavaScript命名空间的一些心得
2014/06/07 Javascript
jquery图片滚动放大代码分享(1)
2015/08/25 Javascript
JS实现环形进度条(从0到100%)效果
2016/07/05 Javascript
基于jQuery实现照片墙自动播放特效
2017/01/12 Javascript
详解微信小程序设置底部导航栏目方法
2017/06/29 Javascript
基于jQuery选择器之表单对象属性筛选选择器的实例
2017/09/19 jQuery
利用Promise自定义一个GET请求的函数示例代码
2019/03/20 Javascript
微信小程序实现按字母排列选择城市功能
2019/11/25 Javascript
[03:06]V社市场总监Dota2项目负责人Erik专访:希望更多中国玩家加入DOTA2
2014/07/11 DOTA
Python中使用scapy模拟数据包实现arp攻击、dns放大攻击例子
2014/10/23 Python
Django之路由层的实现
2019/09/09 Python
python装饰器相当于函数的调用方式
2019/12/27 Python
python的链表基础知识点
2020/09/13 Python
Shoes For Crews法国官网:美国领先的防滑鞋设计和制造商
2018/01/01 全球购物
法国二手手袋、手表和奢侈珠宝购物网站:Collector Square
2018/07/05 全球购物
物流管理毕业生自荐信
2013/10/24 职场文书
英语专业毕业生自荐信
2013/10/28 职场文书
自荐信的五个重要部分
2013/10/29 职场文书
采购部岗位职责
2013/11/24 职场文书
入团者的自我评价分享
2013/12/02 职场文书
警校毕业生自我评价
2014/04/06 职场文书
五四青年节演讲稿
2014/05/26 职场文书
2014年医务科工作总结
2014/12/18 职场文书
2015年社区环境卫生工作总结
2015/04/21 职场文书
Redis IP地址的绑定的实现
2021/05/08 Redis
Redis Cluster 集群搭建你会吗
2021/08/04 Redis