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 相关文章推荐
读jQuery之六 缓存数据功能介绍
Jun 21 Javascript
js限制checkbox选中个数以限制六个为例
Jul 15 Javascript
JavaScript数组去重的3种方法和代码实例
Jul 01 Javascript
基于jquery实现图片放大功能
May 07 Javascript
JavaScript学习小结之使用canvas画“哆啦A梦”时钟
Jul 24 Javascript
AngularJS中过滤器的使用与自定义实例代码
Sep 17 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
Jan 19 Javascript
jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】
Mar 03 Javascript
JS简单封装的图片无缝滚动效果示例【测试可用】
Mar 22 Javascript
原生JS实现列表内容自动向上滚动效果
May 22 Javascript
vue用BMap百度地图实现即时搜索功能
Sep 26 Javascript
使用Vue生成动态表单
Nov 26 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
十天学会php之第十天
2006/10/09 PHP
php简单封装了一些常用JS操作
2007/02/25 PHP
php数组一对一替换实现代码
2012/08/31 PHP
处理(php-cgi.exe - FastCGI 进程超过了配置的请求超时时限)的问题
2013/07/03 PHP
ThinkPHP Mobile使用方法简明教程
2014/06/18 PHP
PHP生成二维码的两个方法和实例
2014/07/01 PHP
php程序员应具有的7种能力小结
2014/11/27 PHP
Yii实现的多级联动下拉菜单
2016/07/13 PHP
PHP多进程编程之僵尸进程问题的理解
2017/10/15 PHP
Aster vs Newbee BO5 第三场2.19
2021/03/10 DOTA
textContent在Firefox下与innerText等效的属性
2007/05/12 Javascript
根据地区不同显示时间的javascript代码
2007/08/13 Javascript
Jquery练习之表单验证实现代码
2010/12/14 Javascript
JS date对象的减法处理实现代码
2010/12/28 Javascript
javascript 获取网页标题代码实例
2014/01/22 Javascript
jquery mobile 移动web(5)
2015/12/20 Javascript
Node.js 条形码识别程序构建思路详解
2016/02/14 Javascript
checkbox 选中一个另一个checkbox也会选中的实现代码
2016/07/09 Javascript
Angular 4依赖注入学习教程之ClassProvider的使用(三)
2017/06/04 Javascript
详解Vue路由开启keep-alive时的注意点
2017/06/20 Javascript
一种angular的方法级的缓存注解(装饰器)
2018/03/13 Javascript
解决vue.js 数据渲染成功仍报错的问题
2018/08/25 Javascript
python中关于时间和日期函数的常用计算总结(time和datatime)
2013/03/08 Python
解析Python中while true的使用
2015/10/13 Python
windows10系统中安装python3.x+scrapy教程
2016/11/08 Python
使用python实现个性化词云的方法
2017/06/16 Python
MySQL适配器PyMySQL详解
2017/09/20 Python
Python中的二维数组实例(list与numpy.array)
2018/04/13 Python
Python发送邮件的实例代码讲解
2019/10/16 Python
python使用beautifulsoup4爬取酷狗音乐代码实例
2019/12/04 Python
贝玲妃美国官方网站:Benefit美国
2016/08/28 全球购物
毕业生求职信的经典写法
2014/01/31 职场文书
地道战观后感400字
2015/06/04 职场文书
小学运动会通讯稿
2015/07/18 职场文书
python实现股票历史数据可视化分析案例
2021/06/10 Python
python实现简单石头剪刀布游戏
2021/10/24 Python