鼠标事件event和坐标
鼠标事件（e=e||window.event）
event.clientX、event.clientY
鼠标相对于浏览器窗口可视区域的X，Y坐标（窗口坐标），可视区域不包括工具栏和滚动条。IE事件和标准事件都定义了这2个属性
event.pageX、event.pageY
类似于event.clientX、event.clientY，但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性，但得到了广泛支持。IE事件中没有这2个属性。
event.offsetX、event.offsetY
鼠标相对于事件源元素（srcElement）的X,Y坐标，只有IE事件有这2个属性，标准事件没有对应的属性。
event.screenX、event.screenY
鼠标相对于用户显示器屏幕左上角的X,Y坐标。标准事件和IE事件都定义了这2个属性
知识点1：确定鼠标按钮（event.button）
实例
<html>
<head>
<script type="text/javascript">
function whichButton(event)
{
var btnNum = event.button;
if (btnNum==)
{
alert("您点击了鼠标右键！")
}
else if(btnNum==)
{
alert("您点击了鼠标左键！")
}
else if(btnNum==)
{
alert("您点击了鼠标中键！");
}
else
{
alert("您点击了" + btnNum+ "号键，我不能确定它的名称。");
}
}
</script>
</head> <body onmousedown="whichButton(event)">
<p>请在文档中点击鼠标。一个消息框会提示出您点击了哪个鼠标按键。</p>
</body> </html>
知识点2：鼠标相对屏幕的距离（x=event.screenX / y=event.screenY )
实例
<html>
<head> <script type="text/javascript">
function coordinates(event)
{
x=event.screenX
y=event.screenY
alert("X=" + x + " Y=" + y)
} </script>
</head>
<body onmousedown="coordinates(event)"> <p>
在文档中点击某个位置。消息框会提示出指针相对于屏幕的 x 和 y 坐标。
</p> </body>
</html>
知识点3：鼠标相对于浏览器窗口的坐标（ x=event.clientX / y=event.clientY ）
<html>
<head>
<script type="text/javascript">
function show_coords(event)
{
x=event.clientX
y=event.clientY
alert("X 坐标: " + x + ", Y 坐标: " + y)
}
</script>
</head> <body onmousedown="show_coords(event)"> <p>请在文档中点击。一个消息框会提示出鼠标指针的 x 和 y 坐标。</p> </body>
</html>
知识点4：获取键盘的按键的 unicode（event.keyCode）
<html>
<head>
<script type="text/javascript">
function whichButton(event)
{
alert(event.keyCode)
} </script>
</head> <body onkeyup="whichButton(event)">
<p><b>注释：</b>在测试这个例子时，要确保右侧的框架获得了焦点。</p>
<p>在键盘上按一个键。消息框会提示出该按键的 unicode。</p>
</body> </html>
鼠标事件event和坐标的更多相关文章
- qt鼠标事件总结（坐标，跟踪，点击判断）
1.QMouseEvent中的坐标QMouseEvent中保存了两个坐标,一个是全局坐标,当然另外一个是局部坐标.全局坐标(globalPos())即是桌面屏幕坐标(screen coordinate ...
- 第53天：鼠标事件、event事件对象
-->鼠标事件-->event事件对象-->默认事件-->键盘事件(keyCode)-->拖拽效果 一.鼠标事件 onclick ---------------鼠标点击事 ...
- Opencv处理鼠标事件-OpenCV步步精深
在图片上双击过的位置绘制一个 圆圈 鼠标事件就是和鼠标有关的,比如左键按下,左键松开,右键按下,右键松开,双击右键等等. 我们可以通过鼠标事件获得与鼠标对应的图片上的坐标.我们通过以下函数来调用查看所 ...
- JavaScript-4.6鼠标事件监听,获取鼠标坐标window.event---ShinePans
<html> <head> <meta http-equiv="content-type" content="text/html" ...
- setTimeout里无法调用鼠标事件的event
问题的由来是下面这段代码: middleOnmouseLeave: function (event) { setTimeout(function () { event.currentTarget.st ...
- 手持设备点击响应速度，鼠标事件与touch事件的那些事
前言 现在一直在做移动端的开发,这次将单页应用的网页内嵌入了app,于是老大反映了一个问题:app应用点击响应慢!我开始不以为然,于是拿着网页版的试了试,好像确实有一定延迟,于是开始了研究,最后选择了 ...
- 深入学习jQuery鼠标事件
× 目录 [1]类型 [2]写法 [3]合成事件[4]鼠标按键[5]修改键[6]坐标位置 前面的话 鼠标事件是DOM事件中最常用的事件,jQuery对鼠标事件进行了封装和扩展.本文将详细介绍jQuer ...
- 深入理解DOM事件类型系列第一篇——鼠标事件
× 目录 [1]类型 [2]顺序 [3]坐标位置[4]修改键[5]相关元素[6]鼠标按键[7]滚轮事件[8]移动设备 前面的话 鼠标事件是web开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...
- c#全局鼠标事件以及鼠标事件模拟
最近在编写Max插件时,其主容器FlowLayoutPanel由于隐藏了滚动条,要实现按住鼠标中键上下拖动的功能,因此尝试了全局鼠标事件.以及鼠标勾子,可惜由于Max不争气?都未能实现,于是代码报废, ...
随机推荐
- OS + linux proxy
s Linux主机通过代理服务器进行网络连接 http://www.linuxidc.com/Linux/2015-01/111703.htm 新手用Linux做代理服务器 三招搞定 http://b ...
- 【JAVA】使用IntelliJ IDEA创建Java控制台工程
1.File->New->Project 2.选择Java,下一步 3.模板有两个:Command Line App和Java Hello World,没有太大区别 4.命名: 5.结果:
- CrawlSpiders模块的使用
创建文件模板 scrapy genspider -t crawl tencent tencent.com CrawlSpiders就是为爬取整站孕育而生的,我们以前是分页下一页,然后再yied.这样太 ...
- synchronized和volatile的区别
但是volatile不适合做计数器使用,即使他具有可见性,但是它不具有原子性.不能保证数据的一致性. 但是volatile适合哪种场景呢? 比较适合做一些标示.比如说两个线程,线程B必须得等线程A执行 ...
- 2018牛客网暑期ACM多校训练营（第一场）E Removal（DP）
题意 给你一个大小为n的数组,你可以删掉数组中的任意m个数,问你在删除m个数之后剩下的数组有多少种.(其中数组的每个数的大小<=k) 分析 显然需要动态规划,而k又很小,所以二维dp没问题. 设 ...
- Git与GitHub学习笔记（一）如何删除github里面的文件夹？
按照以下步骤即可(本地删除) 1. git pull you git url2. git checkout 3. rm -r dirName4. git add --all5. git commit ...
- Linux 三剑客 -- awk sed grep
本文由本人收集整理自互联网供自己与网友参考,参考文章均已列出,如有侵权,请告知! 顶配awk,中配sed,标配grep awk 参考 sed 参考 grep 参考 在线查看linux命令速记表 app ...
- java.lang.String & java.lang.StringBuilder
java.lang.String & java.lang.StringBuilder String 成员方法 作用 public charAr(int index) 返回给定位置的代码单元 p ...
- Mac 键盘符号 及VSCode快捷键 说明
Mac 键盘符号说明 ⌘ == Command ⇧ == Shift ⇪ == Caps Lock ⌥ == Option ⌃ == Control ↩ == Return/Enter ⌫ == De ...
- python3.x与2.x区别
1.性能 Py3.0运行 pystone benchmark的速度比Py2.5慢30%.Guido认为Py3.0有极大的优化空间,在字符串和整形操作上可 以取得很好的优化结果. Py3.1性能比Py2 ...