1、clientX、clientY      光标位置——>距离当前body可视区域的x，y坐标

2、pageX、pageY    光标位置——> 对于整个页面来说，包括了被卷去的body部分的长度

3、screenX、screenY  光标位置——>点击位置距离当前电脑屏幕的x，y坐标

4、offsetX、offsetY   光标位置——> 相对于带有定位的父盒子的x，y坐标

5、x、y   光标位置——>点击位置距离当前电脑屏幕的x，y坐标

具体如图所示：

js 鼠标位置的更多相关文章

  1. js获取鼠标位置的各种方法

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  2. 通过了解JS的clientX、pageX、screenX等方法来获取鼠标位置相对屏幕，相对浏览器窗口，相对文档的坐标详解

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  3. JS获取鼠标位置，兼容IE FF

    由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...

  4. js如何获取鼠标位置

    获取鼠标位置,首先需要加载js文件: 然后设置一个div,给定大小: 最后进行具体操作: //首先要先设置一个div,给定大小 <div id="m"></div ...

  5. JS魔法堂：关于元素位置和鼠标位置的属性

    一.关于鼠标位置的属性   1. 触发鼠标事件的区域 盒子模型中的border,padding,content区域会触发鼠标事件,点击margin区域将不触发鼠标事件.   2. 鼠标事件对象Mous ...

  6. jq获取鼠标位置

    jq获取鼠标位置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. js鼠标及对象坐标控制属性详细解析

    对js鼠标及对象坐标控制属性进行了详细的分析介绍.  offsetTop获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算顶端位置. offsetLeft获取对象相对于版面或由 ...

  8. JS鼠标滚动插件scrollpath使用介绍

    JS鼠标滚动插件scrollpath:在这个插件中首先要引人的JS是jQuery,因为后面的JS都是基于它的.再者需要引入的是jquery.scrollpath.js.scrollpath.css还有 ...

  9. 兼容IE FF 获取鼠标位置

    由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...

随机推荐

  1. HTML5的5个的新特性

    特性1:正则表达式 无须使用服务端的检测,使用浏览器的本地功能,就可以帮助你判断邮箱的格式,URL,电话,防止用户输入错误的信息,通过H5的pattern属性,很方便的整合这个功能. <inpu ...

  2. Linux 端口进程查看

    netstat -lnp|grep 80

  3. 网易大数据平台的Spark技术实践

    网易大数据平台的Spark技术实践 作者 王健宗 网易的实时计算需求 对于大多数的大数据而言,实时性是其所应具备的重要属性,信息的到达和获取应满足实时性的要求,而信息的价值需在其到达那刻展现才能利益最 ...

  4. Native memory allocation (mmap) failed to map xxx bytes for committing reserved memory

    遇到问题 在服务器上运行 nexus 出现Native memory allocation (mmap) failed to map 838860800 bytes for committing re ...

  5. H3C RIP路由表的初始化

  6. H3C IPv6地址构成

  7. openmp的g++并行执行

    #include <omp.h>#include <stdio.h>#include <stdlib.h>void Test(int n) {    for(int ...

  8. Spring Boot实战之单元测试

    Spring Boot实战之单元测试 本文介绍使用Spring测试框架提供的MockMvc对象,对Restful API进行单元测试 Spring测试框架提供MockMvc对象,可以在不需要客户端-服 ...

  9. Java零散记录

    接口不能被实例化,所以其成员变量必须为不可修改的,就是常量.

  10. VS code 汉化及快捷键修改

    VsCode汉化方式 Vscode是一款开源的跨平台编辑器.默认情况下,vscode使用的语言为英文(us),如何将其显示语言修改成中文了? 打开vscode工具: 点击左侧的Extensions(拓 ...