鼠标事件(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和坐标的更多相关文章

  1. qt鼠标事件总结(坐标,跟踪,点击判断)

    1.QMouseEvent中的坐标QMouseEvent中保存了两个坐标,一个是全局坐标,当然另外一个是局部坐标.全局坐标(globalPos())即是桌面屏幕坐标(screen coordinate ...

  2. 第53天:鼠标事件、event事件对象

    -->鼠标事件-->event事件对象-->默认事件-->键盘事件(keyCode)-->拖拽效果 一.鼠标事件 onclick ---------------鼠标点击事 ...

  3. Opencv处理鼠标事件-OpenCV步步精深

    在图片上双击过的位置绘制一个 圆圈 鼠标事件就是和鼠标有关的,比如左键按下,左键松开,右键按下,右键松开,双击右键等等. 我们可以通过鼠标事件获得与鼠标对应的图片上的坐标.我们通过以下函数来调用查看所 ...

  4. JavaScript-4.6鼠标事件监听,获取鼠标坐标window.event---ShinePans

    <html> <head> <meta http-equiv="content-type" content="text/html" ...

  5. setTimeout里无法调用鼠标事件的event

    问题的由来是下面这段代码: middleOnmouseLeave: function (event) { setTimeout(function () { event.currentTarget.st ...

  6. 手持设备点击响应速度,鼠标事件与touch事件的那些事

    前言 现在一直在做移动端的开发,这次将单页应用的网页内嵌入了app,于是老大反映了一个问题:app应用点击响应慢!我开始不以为然,于是拿着网页版的试了试,好像确实有一定延迟,于是开始了研究,最后选择了 ...

  7. 深入学习jQuery鼠标事件

    × 目录 [1]类型 [2]写法 [3]合成事件[4]鼠标按键[5]修改键[6]坐标位置 前面的话 鼠标事件是DOM事件中最常用的事件,jQuery对鼠标事件进行了封装和扩展.本文将详细介绍jQuer ...

  8. 深入理解DOM事件类型系列第一篇——鼠标事件

    × 目录 [1]类型 [2]顺序 [3]坐标位置[4]修改键[5]相关元素[6]鼠标按键[7]滚轮事件[8]移动设备 前面的话 鼠标事件是web开发中最常用的一类事件,毕竟鼠标是最主要的定位设备.本文 ...

  9. c#全局鼠标事件以及鼠标事件模拟

    最近在编写Max插件时,其主容器FlowLayoutPanel由于隐藏了滚动条,要实现按住鼠标中键上下拖动的功能,因此尝试了全局鼠标事件.以及鼠标勾子,可惜由于Max不争气?都未能实现,于是代码报废, ...

随机推荐

  1. Zabbix Server 自带模板监控无密码MySQL数据库

    Zabbix Server 自带模板监控无密码MySQL数据库 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任.  一.安装MariaDB 1>.安装MariaDB  [root ...

  2. SQL优化笔记一:索引和explain

    目录 为什么需要优化SQL SQL优化的重点 索引 索引的结构 索引的优缺点总结: 索引的分类 索引操作 B树 实战 问题 数据库方面,我会使用MySQL来讲解 为什么需要优化SQL 性能低,执行时间 ...

  3. Hbase记录-备份与恢复方案推荐

    热备份和冷备份参考方案,如在生产环境,请结合业务情况考虑

  4. 归并排序_JAVA

    import java.util.Arrays; public class Main { public static void main(String[] args) { int[] a = { 6, ...

  5. [Android] Android 使用 Greendao 操作 db sqlite

    Android 使用 Greendao 操作 db sqlite GreenDAO是一个开源的安卓ORM框架,能够使SQLite数据库的开发再次变得有趣.它减轻开发人员处理低级数据库需求,同时节省开发 ...

  6. vue加载本地json文件

    背景:做地区跟行业级联下拉选择,因为想做成可以搜索的,所以必须一次加载数据,后台有做memcache缓存,但因为数据量大,还是比较费时间,所以做成本地文件,简单记录一下 准备数据,放到static下 ...

  7. github 建立主页

    听同学介绍用github 建立自己的主页,做出来真是高大上.不行我也要学习学习 做一个只显示hello world 的主页哦 1. create repository(要和自己的github的user ...

  8. RHEL 6.4 通过mysql安装文件安装mysql

    参考文章:http://www.linuxidc.com/Linux/2013-12/93507.htm 1.首先下载mysql安装文件 我是下载的最新版的5.6 2. 以RPM方式安装MySQL 在 ...

  9. 阿里云三台CentOS7.2配置安装CDH5.12

    1 购买3台阿里云服务 2 配置好ssh连接客户端 根据自己情况连接 3 安装好MySQL5.7 跳过,见之前博客 安装在hadoop001上 4 设置好Hosts文件 3台机器同时操作 vim /e ...

  10. org.apache.flume.conf.ConfigurationException: Channel c1 not in active set.

    1 错误详细信息 WARN conf.FlumeConfiguration: Could not configure sink k1 due to: Channel c1 not in active ...