pageX和pageY
pageX() 属性是鼠标指针的位置,相对于文档的左边缘。
pageY() 属性是鼠标指针的位置,相对于文档的上边缘。
- 例1
$(document).mousemove(function(e){
$("span").text("X: " + e.pageX + ", Y: " + e.pageY);
});
- 例2
$('#demo').off('click').on('click',function(e){
$("span").text("X: " + e.pageX + ", Y: " + e.pageY);
});
pageX和pageY的更多相关文章
- pageX、pageY全兼容
pageX.pageY全兼容 var pos=function(o,x,y,event){var posX=0,posY=0;var e=event||window.event;if(e.posX|| ...
- 一文看懂js中的clientX,clientY,pageX,pageY,screenX,screenY
一. 客户区坐标位置(clientX,clientY) 鼠标事件都是在浏览器视口中的特定位置发生的.这个位置信息保存在事件对象的clientX和clientY属性中,所有浏览器都支持这两个属性. 我们 ...
- 理解 e.clientX,e.clientY e.pageX e.pageY e.offsetX e.offsetY
event.clientX.event.clientY 鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条.IE事件和标准事件都定义了这2个属性 event.pageX ...
- 元素位置pageX,pageY,clientX,clientY,scrollX,scrollY,screenX,screenY,offsetX,offsetY
总结: event.clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条. (可见区域)event.clientY 设置或获取鼠标指针位置相对于当 ...
- 手机e.pageX和e.pageY无效的原因
手机端拖拽事件: touchstart事件:当手指触摸屏幕时候触发,即使已经有一个手指放在屏幕上也会触发. touchmove事件:当手指在屏幕上滑动的时候连续地触发.在这个事件发生期间,调用prev ...
- 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 ...
- 图解Js event对象offsetX, clientX, pageX, screenX, layerX, x区别
通过 3 张图和 1 张表格,轻松区别 JavaScript Event 对象中的offsetX, clientX, pageX, screenX, layerX, x等属性. 一.测试代码如下: & ...
- offsetWidth, offsetHeight, offsetLeft, offsetTop,clientWidth, clientHeight,clientX,pageX,screenX
offsetWidth: 元素在水平方向上占用的空间大小.包括元素的宽度,内边距,(可见的)垂直滚动条的宽度,左右边框的宽度. offsetHeight:元素在垂直方向上占用的空间大小,包括元素的高度 ...
- 扒一扒offsetleft,srollleft,pagex,clientx,postion().left等精确位置的获取与理解
先上个pc端和手机端的图: 说明:上面的属性,都是in这个div的属性值.我是点击的in这个div的左上角,所以pageX.pageY是40. HTML: <div class=" ...
随机推荐
- sphinx配置文件sphinx.conf参数详细说明
sphinx配置文件sphinx.conf参数详细说明 sphinx.conf各个参数详细说明 # # Sphinx configuration file sample # # WARNING! Wh ...
- asp.net控件的Hyperlink控件
Asp.net控件: Hyperlink控件:Hyperlink控件又称为超链接控件,该控件在功能上跟Html的<a herf=””>控件相似,其显示的模式为超链接的形式. 注意: Hyp ...
- 002_Razor简介
关于 Razor: Razor 语句以 @ 字符开始.在使用 Razor 声明视图模型对象的类型时要使用小写字母,如在本例文件 Index.cshtml 文件中 @model 以小写的 m 开头,但要 ...
- 返璞归真 asp.net mvc (13) - asp.net mvc 5.0 新特性
[索引页][源码下载] 返璞归真 asp.net mvc (13) - asp.net mvc 5.0 新特性 作者:webabcd 介绍asp.net mvc 之 asp.net mvc 5.0 新 ...
- 发现自己喜欢了移动端开发--Android
喜欢.net一直到现在了,但是自己做过的项目都不是让我自己很满意,不知道为什么,可能是自己的要求比较高吧! 下面自己记录自己的学习 src专门存放我们java源代码的包 Android 4.2.2存放 ...
- 我所了解的WEB开发(3) - 彩虹的颜色
据说彩虹有七彩颜色,从外至内分别为:红.橙.黄.绿.青.蓝.紫.这些我倒是没有验证过,但是学生时代就不止一次色盲检测,还是让我足够确信对颜色的分辨应该和大多数人相似的. 还听说大多数哺乳动物是色盲.如 ...
- Linux_Centos中搭建nexus私服
1.在Linux下搭建Nexus私服 1).下载并且解压 下载 nexus-2.11.2-03-bundle.zip unzip nexus-2.11.2-03-bundle.z ...
- Android NDK
1.Android之NDK开发 http://www.cnblogs.com/devinzhang/archive/2012/02/29/2373729.html
- Android 缓存目录 Context.getExternalFilesDir()和Context.getExternalCacheDir()方法
一.基础知识 应用程序在运行的过程中如果需要向手机上保存数据,一般是把数据保存在SDcard中的.大部分应用是直接在SDCard的根目录下创建一个文件夹,然后把数据保存在该文件夹中.这样当该应用被卸载 ...
- 搭建Android 5.0开发环境
1.Android SDK的安装 下载地址:http://developer.android.com/index.html 访问网站的话请自备梯子 选择:adt-bundle-windows-x86_ ...