在页面中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 相关文章推荐
js bind 函数 使用闭包保存执行上下文
Dec 26 Javascript
jQuery中index()的用法分析
Sep 05 Javascript
JS获取随机数和时间转换的简单实例
Jul 10 Javascript
微信公众平台开发教程(四) 实例入门:机器人回复(附源码)
Dec 02 Javascript
jquery事件与绑定事件
Mar 16 Javascript
jQuery实现动态生成表格并为行绑定单击变色动作的方法
Apr 17 jQuery
微信小程序的分类页面制作
Jun 27 Javascript
JS一个简单的注册页面实例
Sep 05 Javascript
BootStrap 标题设置跨行无效的解决方法
Oct 25 Javascript
vue中子组件的methods中获取到props中的值方法
Aug 27 Javascript
vue-next/runtime-core 源码阅读指南详解
Oct 25 Javascript
vue实现可以快进后退的跑马灯组件
Apr 08 Vue.js
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 SQL Injection with MySQL
2011/02/27 PHP
php摘要生成函数(无乱码)
2012/02/04 PHP
PHP的基本常识小结
2013/07/05 PHP
Codeigniter中mkdir创建目录遇到权限问题和解决方法
2014/07/25 PHP
PHP经典面试题之设计模式(经常遇到)
2015/10/15 PHP
php文件管理基本功能简单操作
2017/01/16 PHP
Javascript 的addEventListener()及attachEvent()区别分析
2009/05/21 Javascript
Jquery在IE7下无法使用 $.ajax解决方法
2009/11/11 Javascript
jquery checkbox,radio是否选中的判断代码
2010/03/20 Javascript
JS模板实现方法
2013/04/03 Javascript
JS注册/移除事件处理程序(ExtJS应用程序设计实战)
2013/05/07 Javascript
nodejs获取本机内网和外网ip地址的实现代码
2014/06/01 NodeJs
Angularjs注入拦截器实现Loading效果
2015/12/28 Javascript
基于javascript实现九宫格大转盘效果
2020/05/28 Javascript
javascript 注释代码的几种方法总结
2017/01/04 Javascript
Angular实现点击按钮后在上方显示输入内容的方法
2017/12/27 Javascript
Bootstrap 模态框自定义点击和关闭事件详解
2018/08/10 Javascript
浅谈Vue.set实际上是什么
2019/10/17 Javascript
selenium+java中用js来完成日期的修改
2019/10/31 Javascript
element实现合并单元格通用方法
2019/11/13 Javascript
微信小程序登录时如何获取input框中的内容
2019/12/04 Javascript
JS检索下拉列表框中被选项目的索引号(selectedIndex)
2019/12/17 Javascript
通过mod_python配置运行在Apache上的Django框架
2015/07/22 Python
python字典的常用操作方法小结
2016/05/16 Python
Python实现将SQLite中的数据直接输出为CVS的方法示例
2017/07/13 Python
基于python实现名片管理系统
2018/11/30 Python
使用tensorboard可视化loss和acc的实例
2020/01/21 Python
Django Serializer HiddenField隐藏字段实例
2020/03/31 Python
python归并排序算法过程实例讲解
2020/11/04 Python
使用OpenCV实现人脸图像卡通化的示例代码
2021/01/15 Python
消防战士优秀事迹材料
2014/02/13 职场文书
未中标通知书
2015/04/17 职场文书
运动会三级跳加油稿
2015/07/21 职场文书
学习师德师风的心得体会(2篇)
2019/10/08 职场文书
Java实现斗地主之洗牌发牌
2021/06/14 Java/Android
MySQL常用慢查询分析工具详解
2022/08/14 MySQL