Js和JQuery获取鼠标指针坐标的实现代码分享


Posted in Javascript onMay 25, 2015
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<title>jquery 获取鼠标指针的坐标</title>
<script>
//普通js函数
function test(event) {
 event = event || window.event;
 var x = event.offsetX || event.layerX;
 var y = event.offsetY || event.layerY;
 alert("x="+x+"; y="+y);
 }
//jquery函数
$(function(){
 $("#t").mouseover(
 function(event){
  event = event || window.event; 
  var x = event.offsetX || event.originalEvent.layerX;
  var y = event.offsetY || event.originalEvent.layerY;
  alert("x:"+x+"; y:"+y);
 }
 );
 });
</script>

</head>

<body>
<div id="t" style="float:left;background-color: green;width: 300px;height: 60px;">测试鼠标位置(jquery函数处理)</div>
<div id="s" onmouseover="test(event)" style="float:left;background-color: red;width: 300px;height: 60px;margin-left:10px;">测试鼠标位置(普通js函数处理)</div>

</body>
</html>
Javascript 相关文章推荐
用 Javascript 验证表单(form)中多选框(checkbox)值
Sep 08 Javascript
Javascript 面向对象 继承
May 13 Javascript
js中confirm实现执行操作前弹出确认框的方法
Nov 01 Javascript
jQuery实现的仿百度分页足迹效果代码
Oct 30 Javascript
高效的jquery数字滚动特效
Dec 17 Javascript
即将发布的jQuery 3 有哪些新特性
Apr 14 Javascript
利用Node.js+Koa框架实现前后端交互的方法
Feb 27 Javascript
vue-cli axios请求方式及跨域处理问题
Mar 28 Javascript
详解Vue+ElementUI从零开始搭建自己的网站(一、环境搭建)
Apr 30 Javascript
前端路由&amp;webpack基础配置详解
Jun 10 Javascript
微信小程序 轮播图实现原理及优化详解
Sep 29 Javascript
mpvue 项目初始化及实现授权登录的实现方法
Jul 20 Javascript
Javascript实现飞动广告效果的方法
May 25 #Javascript
javascript自定义右键弹出菜单实现方法
May 25 #Javascript
JS+DIV实现鼠标划过切换层效果的方法
May 25 #Javascript
JavaScript实现仿网易通行证表单验证
May 25 #Javascript
js+cookies实现悬浮购物车的方法
May 25 #Javascript
手机开发必备技巧:javascript及CSS功能代码分享
May 25 #Javascript
JS和css实现检测移动设备方向的变化并判断横竖屏幕
May 25 #Javascript
You might like
可快速识别放射性物质-国外大神教你diy一个开放式辐射探测器
2020/03/12 无线电
PHP 身份验证方面的函数
2009/10/11 PHP
thinkphp实现上一篇与下一篇的方法
2014/12/08 PHP
WordPress特定文章对搜索引擎隐藏或只允许搜索引擎查看
2015/12/31 PHP
PHP _construct()函数讲解
2019/02/03 PHP
Javascript中的常见排序算法
2007/03/27 Javascript
Javascript 代码也可以变得优美的实现方法
2009/06/22 Javascript
Mootools 1.2教程 正则表达式
2009/09/15 Javascript
基于Jquery的实现回车键Enter切换焦点
2010/09/14 Javascript
node.js下LDAP查询实例分享
2015/09/30 Javascript
微信小程序 空白页重定向解决办法
2017/06/27 Javascript
详解如何在vue项目中使用eslint+prettier格式化代码
2018/11/10 Javascript
Vue如何获取数据列表展示
2019/12/11 Javascript
JS自定义对象创建与简单使用方法示例
2020/01/15 Javascript
vue项目中使用bpmn为节点添加颜色的方法
2020/04/30 Javascript
Vue+Openlayers自定义轨迹动画
2020/09/24 Javascript
Python打包文件夹的方法小结(zip,tar,tar.gz等)
2016/09/18 Python
python输入错误密码用户锁定实现方法
2017/11/27 Python
python实现冒泡排序算法的两种方法
2018/03/10 Python
python实现多进程代码示例
2018/10/31 Python
如何使用python爬虫爬取要登陆的网站
2019/07/12 Python
Django单元测试中Fixtures用法详解
2020/02/25 Python
Python如何使用paramiko模块连接linux
2020/03/18 Python
Python爬虫requests库多种用法实例
2020/05/28 Python
浅析pandas随机排列与随机抽样
2021/01/22 Python
Stylenanda中文站:韩国一线网络服装品牌
2016/12/22 全球购物
应届生文秘专业个人自荐信格式
2013/09/21 职场文书
回门宴新郎答谢词
2014/01/12 职场文书
求职信的最佳写作思路
2014/02/01 职场文书
《玩具柜台前的孩子》教学反思
2014/02/13 职场文书
本科毕业生自荐信
2014/05/26 职场文书
苦儿流浪记读书笔记
2015/07/01 职场文书
先进党支部事迹材料2016
2016/02/26 职场文书
创业计划书之婴幼儿游泳馆
2019/09/11 职场文书
vue实现无缝轮播效果(跑马灯)
2021/05/14 Vue.js
Pygame Event事件模块的详细示例
2021/11/17 Python