pageX/pageY,screenX/screenY,clientX/clientY的差别

$(document).click(function(e){

//x方向无差别
//alert(e.pageX+','+e.screenX+','+e.clientX);
//y方向有差别,无滚动条时pageY和clientY一样,有的话三者有差别
alert(e.pageY+','+e.screenY+','+e.clientY);

});

pageX/pageY,screenX/screenY,clientX/clientY的差别的更多相关文章

  1. js进阶 12-7 pageY和screenY以及clientY的区别是什么

    js进阶 12-7 pageY和screenY以及clientY的区别是什么 一.总结 一句话总结:pageY是距文件,screenY是获取显示器屏幕位置的坐标,clientY是页面视口. 没有滚动条 ...

  2. pagex,screenx,clientx的差别

    screenX:參照物为电脑的屏幕左上角,距离电脑屏幕的水平距离 clientX:參照物是内容区域左上角,距离内容区域左上角的水平距离,会随着滚动栏的移动而移动 pageX:參照物也是内容区域的左上角 ...

  3. Js event对象offsetX,pageX,screenX,clientX详解

       平时在测量元素位置时难以确定,下面给出具体的event对象中的各种属性,以便日后使用.   检测相对于浏览器的位置:clientX和clientY     当鼠标事件发生时,鼠标相对于浏览器左上 ...

  4. 如何更好的理解(pageX,pageY,clientX,clientY,eventX,eventY,scrollX,scrollY,screenX,screenY,event.offsetX,event.offsetY,offsetLeft,style.left)

    1 pageX,pageY:鼠标指针相对于当前窗口的X,Y坐标,计算区域包括窗口自身的控件和滚动条.(火狐特有) 2 event.clientX,event.clientY:鼠标指针相对于当前窗口的X ...

  5. 元素位置pageX,pageY,clientX,clientY,scrollX,scrollY,screenX,screenY,offsetX,offsetY

    总结: event.clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条. (可见区域)event.clientY 设置或获取鼠标指针位置相对于当 ...

  6. JS之clientX,clientY,screenX,screenY,offsetX,offsetY区别

    首先需要知道clientX,clientY,screenX,screenY,offsetX,offsetY 是鼠标事件对象下的几个属性. 之前也一直对这些属性搞的稀里糊涂,看文档上说的也是不太理解,反 ...

  7. clientX, clientY,offsetX, offsetY,screenX, screenY, x, y

    clientX, clientY是鼠标当前相对于网页的位置,当鼠标位于页面左上角时clientX=0, clientY=0: offsetX, offsetY是鼠标当前相对于网页中的某一区域的位置,当 ...

  8. pageX/Y, offset(), position(), scrollTop(), screenX/Y, clientX/Y, pageX/Y

    event.pageX get mouse position Description: The mouse position relative to the left edge of the docu ...

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

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

随机推荐

  1. 循环神经网络(RNN)

    1.    场景与应用 在循环神经网络可以用于文本生成.机器翻译还有看图描述等,在这些场景中很多都出现了RNN的身影. 2.    RNN的作用 传统的神经网络DNN或者CNN网络他们的输入和输出都是 ...

  2. packert tracer配置路由器

    配置路由器snmp: https://wenku.baidu.com/view/e73c343f0b4c2e3f57276329.html

  3. leetcode138

    /** * Definition for singly-linked list with a random pointer. * struct RandomListNode { * int label ...

  4. [PHP]用户登陆中间件

    Laravel 4中,可以使用Route::filter,而在Laravel 5中,没有了filter.php文件,官方建议使用中间件做. 下面是用户登陆的测试例子,涉及到的一些方法和使用,先参见这里 ...

  5. as3 加载gif loader

    as3原生不支持gif动态图 loader 加载gif ,内容只是以bitmap加载进来 需要动态,另外衍生类: https://files.cnblogs.com/files/dt1991/GifL ...

  6. Simple2D-24 Sprite 渲染树

    如果要开发游戏,单单使用 Painter 绘制图片会变得十分复杂.如果使用 Sprite 对象进行显示,可以简单地实现图片的位移.旋转和缩放,结合 Action 对象可以实现复杂的动画效果.最重要的是 ...

  7. ABAP-关于隐式与显式的DB Commit

    转载:https://www.cnblogs.com/liaojunbo/archive/2011/07/11/2103491.html 1.显式的DB Commit 显式的DB Commit并没有对 ...

  8. svn更新代码时控制台出现的英文字母表示什么意思

    U:表示从服务器收到文件更新了 G:表示本地文件以及服务器文件都已经更新,而且成功的合并了 A:表示有文件或者目录添加到工作目录 R:表示文件或者目录被替换了 C:表示文件的本地修改和服务器修改发生冲 ...

  9. Linux 如何将一个文件夹的所有内容授权给某一个用户

    我们可以使用chown命令,ch这里代表change(改变)的意思,own代表英文单词的owner(拥有者),连在一起就是 change owner ,改变某个文件或者文件夹的拥有者. 一般只有roo ...

  10. C++中怎么创建类对象

    在C++里,有两种方法创建对象:方法一:ClassName object(param);这样就声明了一个ClassName类型的object对象,C++会为它分配足够的存放对象所有成员的存储空间.注意 ...