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. js原生继承几种方式

    js原生继承 js本身并没有继承和类的概念,本质上是通过原型链(prototype)的形式实现的. 1.先写两个构造函数Parent和Child,用于将Child继承Parent function P ...

  2. iptables单个规则实例

    iptables -F? # -F 是清除的意思,作用就是把 FILTRE TABLE 的所有链的规则都清空 iptables -A INPUT -s 172.20.20.1/32 -m state ...

  3. ArrayList中remove方法和set(null)的区别

    在分析源码ArrayList.remove()时,偶然发现了一个疑惑的点,就是:源码也是将最后一个对象的引用指向null(源码:elementData[--size] = null; // clear ...

  4. 4-1 自动生成spider模板的命令

    scrapy genspider 爬虫名 爬取得网站url例:scrapy genspider jobble2 blog.jobbole.com

  5. Linux 内核SBus连接

    当大部分计算机配备有 PCI 或 ISA 接口总线, 大部分老式的基于 SPARC 的工作站使用 SBus 来连接它们的外设. SBus 使一个非常先进的设计, 尽管它已出现很长时间. 它意图是处理器 ...

  6. SVG路径无法识别问题

    SVG 路径不规范无法识别 使用 (?<=(,|-))\. 替换为0. 即可

  7. Visio图像应用

    图像插入: 直接搜索然后插入 CAD是工程绘图. CAD属性设置框 下面是图像编辑: 通过格式中的旋转进行调整 但是CAD格式的图没有格式 图片可以设置题注 图片层次的使用 CAD图片颜色的修改在 图 ...

  8. 《HelloGitHub》第 45 期

    兴趣是最好的老师,HelloGitHub 就是帮你找到兴趣! 简介 分享 GitHub 上有趣.入门级的开源项目. 这是一个面向编程新手.热爱编程.对开源社区感兴趣 人群的月刊,月刊的内容包括:各种编 ...

  9. mysql主从之多线程复制

    多线程复制 mysql 主从复制原理: 1. master 节点上的binlogdump 线程,在slave 与其正常连接的情况下,将binlog 发送到slave 上. 2. slave 节点的I/ ...

  10. mysql主从之binlog日志

    mysql的binlog说明 主从复制依赖于二进制日志文件,简称为binlog binlog里面有存放了偏移信息 mysql主库binlog信息查看命令 [root@master ~]# mysql ...