在页面中js获取光标/鼠标的坐标及光标的像素坐标


Posted in Javascript onNovember 11, 2013

近期为网站开发页面统计,以前虽然也开发过,但是功能不是很全,所以这次把一些好功能给用上。

例如这次的,页面JS光标/鼠标坐标,你也许问着有什么用,百度统计中有个热点统计图,这下清楚明白了吧。

好了,上肉:
功能:获取光标的像素坐标

<html> 
<head> 
<script type="text/javascript"> 
function showPosition(e){ 
var x,y; 
var e = e||window.event; document.getElementById("x").value = e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft; 
document.getElementById("y").value = e.clientY+document.body.scrollTop+document.documentElement.scrollTop 
} 
</script> 
</head> 
<body> 
<div onmousemove="showPosition(event);" style="height:100%; width:100%;"> 
x:<input id="x" type="text" value="" /> 
y:<input id="y" type="text" value="" /> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
javascript 面向对象全新理练之继承与多态
Dec 03 Javascript
javascript function调用时的参数检测常用办法
Feb 26 Javascript
jquery和javascript的区别(常用方法比较)
Jul 04 Javascript
JavaScript将相对地址转换为绝对地址示例代码
Jul 19 Javascript
基于jQuery实现交互体验社会化分享代码附源码下载
Jan 04 Javascript
使用JavaScript脚本判断页面是否在微信中被打开
Mar 06 Javascript
javascript使用闭包模拟对象的私有属性和方法
Oct 05 Javascript
js图片轮播手动切换特效
Jan 12 Javascript
微信小程序页面传值实例分析
Apr 19 Javascript
JavaScript中重名的函数与对象示例详析
Sep 28 Javascript
Node.js Express安装与使用教程
May 11 Javascript
layer.alert回调函数执行关闭弹窗的实例
Sep 11 Javascript
js中关于一个分号的崩溃示例
Nov 11 #Javascript
javascript中怎么做对象的类型判断
Nov 11 #Javascript
jquery隐藏标签和显示标签的实例
Nov 11 #Javascript
jquery(hide方法)隐藏指定元素实例
Nov 11 #Javascript
javascript垃圾收集机制与内存泄漏详细解析
Nov 11 #Javascript
JavaScript对内存分配及管理机制详细解析
Nov 11 #Javascript
javascript内存管理详细解析
Nov 11 #Javascript
You might like
php计划任务之验证是否有多个进程调用同一个job的方法
2015/12/07 PHP
PHP基于单例模式实现的数据库操作基类
2016/01/15 PHP
JavaScript实现动态增加文件域表单
2009/02/12 Javascript
删除javascript中注释语句的正则表达式
2014/06/11 Javascript
javascript使用call调用微信API
2014/12/15 Javascript
javascript与css3动画结合使用小结
2015/03/11 Javascript
jQuery实用技巧必备(上)
2015/11/02 Javascript
BootStrap iCheck插件全选与获取value值的解决方法
2016/08/24 Javascript
浅谈vue路径优化之resolve
2017/10/13 Javascript
Vue2.X 通过AJAX动态更新数据
2018/07/17 Javascript
纯javascript前端实现base64图片下载(兼容IE10+)
2018/09/14 Javascript
微信小程序利用swiper+css实现购物车商品删除功能
2019/03/06 Javascript
vue登录注册实例详解
2019/09/14 Javascript
vue引用外部JS的两种种方法
2020/01/28 Javascript
vue flex 布局实现div均分自动换行的示例代码
2020/08/05 Javascript
[04:49]期待西雅图之战 2016国际邀请赛中国区预选赛WINGS战队赛后采访
2016/06/29 DOTA
python+selenium+autoit实现文件上传功能
2017/08/23 Python
一篇文章搞懂Python的类与对象名称空间
2018/12/10 Python
python使用pdfminer解析pdf文件的方法示例
2018/12/20 Python
Python对列表的操作知识点详解
2019/08/20 Python
python内置模块collections知识点总结
2019/12/19 Python
Python学习笔记之装饰器
2020/08/06 Python
有关HTML5页面在iPhoneX适配问题
2017/11/13 HTML / CSS
HTML5的postMessage的使用手册
2018/12/19 HTML / CSS
Java程序员常见面试题
2015/07/16 面试题
控制工程专业个人求职信
2013/09/25 职场文书
专业销售业务员求职信
2013/11/18 职场文书
小学作文评语大全
2014/04/21 职场文书
土地租赁意向书
2014/07/30 职场文书
工会趣味活动方案
2014/08/18 职场文书
装饰施工员岗位职责
2015/04/11 职场文书
2016年“5.12”国际护士节活动总结
2016/04/06 职场文书
2019年公司卫生管理制度样本
2019/08/21 职场文书
Django Paginator分页器的使用示例
2021/06/23 Python
MySQL连表查询分组去重的实现示例
2021/07/01 MySQL
《黑岩★★射手 DAWN FALL》BD发售宣传CM公开
2022/04/04 日漫