pageX、pageY全兼容
pageX、pageY全兼容
var posX=0,posY=0;
var e=event||window.event;
if(e.posX||e.posY){
posX=e.pageX;
posY=e.pageY;
}
else if(e.clientX||e.clientY){
posX=e.clientX+document.documentElement.scrollLeft+document.body.scrollLeft;
posY=e.clientY+document.documentElement.scrollTop +document.body.scrollTop;
}
o.style.position='absolute';
o.style.top=(posY+y)+'px';
o.style.left=(posX+x)+'px';
}
pageX、pageY全兼容的更多相关文章
- JavaScript--clientX,clientY、pageX,pageY、offsetLeft,offsetTop/offsetWidth,offsetHeight、scrollLeft,scrollTop/scrollWidth,scrollHeight、clientHeight,clientWidth区别
/*在事件的内部console.dir(event)*/ /** * 事件对象event * clientX/clientY 获取鼠标基于浏览器窗口(可视区域的坐标位置)全兼容 * * pageX/p ...
- 如何更好的理解(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 ...
- 一句话解释jquery中offset、pageX, pageY、position、scrollTop, scrollLeft的区别
offset 元素相对文档的偏移 pageX, pageY 事件(鼠标)相对文档的偏移 注意:文档是指document, 而不是当前窗口,是包含了滚动位置的,即滚动条的位置对这些值是不产生影响的 ...
- 元素位置pageX,pageY,clientX,clientY,scrollX,scrollY,screenX,screenY,offsetX,offsetY
总结: event.clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条. (可见区域)event.clientY 设置或获取鼠标指针位置相对于当 ...
- pageX/pageY,screenX/screenY,clientX/clientY的差别
pageX/pageY,screenX/screenY,clientX/clientY的差别 $(document).click(function(e){ //x方向无差别 //alert(e.pag ...
- 一文看懂js中的clientX,clientY,pageX,pageY,screenX,screenY
一. 客户区坐标位置(clientX,clientY) 鼠标事件都是在浏览器视口中的特定位置发生的.这个位置信息保存在事件对象的clientX和clientY属性中,所有浏览器都支持这两个属性. 我们 ...
- 页面元素坐标和偏移(clientX/pageX/screenX/layerX/offsetWidth/scrollWidth/clientWidth等)相关整理
鼠标事件都是在特定位置发生的,我们可以通过event事件对象的各种属性来获得事件发生的坐标位置,有相对于视口的,有相对于整个文档的,同样页面元素的位置也有相对视口的,也有滚动后的,这些都比较容易混淆, ...
- pageX、clientX、screenX、offsetX、layerX、x
参考:http://www.cnblogs.com/xesam/archive/2011/12/08/2280509.html chrome: e.pageX--相对整个页面的坐标e.layerX-- ...
- 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 ...
随机推荐
- Android开发之详解五大布局
http://bbs.chinaunix.net/thread-3654213-1-1.html 为了适应各式各样的界面风格,Android系统提供了5种布局,这5种布局分别是: LinearLayo ...
- 20145308刘昊阳 《Java程序设计》第3周学习总结
20145308刘昊阳 <Java程序设计>第3周学习总结 教材学习内容总结 第四章 认识对象 要产生对象必须先定义类,类是对象的设计图,对象是类的实例 类是从少数实例推广到大量相似实例的 ...
- YSLOW
什么是YSlow? YSlow是Yahoo发布的一款基于FireFox的插件. 如何安装YSlow? 安装YSlow必须首先先安装 Firebug,然后下载YSlow,再对其安装. YSlow有什么用 ...
- transform应用详解
关于css3的transform,做了一个demo,上代码 html: <!DOCTYPE html> <html> <head lang="en"& ...
- 【BZOJ】2237: [NCPC2009]Flight Planning
题意 \(n(1 \le n \le 2500)\)个点的树,求删掉一条边再加上一条边使得还是一棵树,且任意两点最大距离最小. 分析 考虑枚举删掉每一条边,我们只需要考虑如何加边容易求得新树的最大距离 ...
- 【BZOJ】3757: 苹果树
http://www.lydsy.com/JudgeOnline/problem.php?id=3757 题意:n个节点的树,每个点有一种颜色.现有m种询问,每次询问x y a b表示x到y的路径上颜 ...
- java画图程序_图片用字母画出来
最近在研究怎样将图片用字母在文本编辑工具中“画”出来. 你看了这个可能还不知道我想说什么? 我想直接上图,大家一定就知道了 第一张:小猫 原图:http://www.cnblogs.com/hongt ...
- JAVA_DES 加密 解密 生成随机密钥
package com.test; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.In ...
- C++ 单元测试 Cpputest
参见:http://cpputest.github.io/ 1. CppUTest是一个C/C++单元测试框架,可以在C/C++项目中使命. 2. 第一个测试 新建一个cpp 文件,包含一个TEST_ ...
- HDU1224 DP
Free DIY Tour Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Tot ...