关于弹出层显示出现的定位方法 document.documentElement.scrollLeft document.body.sc - panshunchang - ITeye博客

`

panshunchang

浏览: 217078 次
性别:
来自: 上海

最近访客更多访客>>

xieye

wy879

yunyouzi

sunlightcs

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

素炒咖啡： 666很实用
jfinal配置servlet
cuixuelei：谢谢
android安装包apk文件反编译代码
jiguixin： ...
android安装包apk文件反编译代码
289909457：解决了我的燃眉之急，谢谢啊
发布Axis的webservice服务调用webservice服务
xoxo_：很明显不对。。。上海对应的城市是错误的。不知道又是从哪里复 ...
全国省市区数据脚本

关于弹出层显示出现的定位方法 document.documentElement.scrollLeft document.body.sc

阅读更多

取得鼠标的坐标方法：

/***
鼠标坐标位置
**/
function mousePosition(ev){
     if(ev.pageX || ev.pageY){
      return {x:ev.pageX, y:ev.pageY};
      }
      return {
       //使用document.documentElement.scrollLeft   这个document.body.scrollLeft不精准
       x:ev.clientX + document.documentElement.scrollLeft - document.documentElement.clientLeft,
       y:ev.clientY + document.documentElement.scrollTop  - document.documentElement.clientTop
       }; 
 } 

/***
鼠标坐标位置
**/
function mouseMove(ev){
    ev = ev || window.event;
    var mousePos = mousePosition(ev);
    x_size = mousePos.x
    y_size = mousePos.y
    //document.getElementById('xxx').value = mousePos.x;
    //document.getElementById('yyy').value = mousePos.y;
}

document.onmousemove = mouseMove;

开始的时候我使用的是

document.body.scrollLeft

方法取得鼠标位置，但是如果页面出现滚动过，就会出现显示偏差，不是我想要的显示位置

其实只要使用document.documentElement.scrollLeft代替body就可以了，不过此时，你需要要在页面上

定义

<html xmlns="http://www.w3.org/1999/xhtml">
即可。

分享到：

hibernate的Query查询的缓存的问题 | webwork+freemarker 标签数字格式显示 ...

2011-09-09 17:14
浏览 2670
评论(0)
分类:Web前端
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题: 在探讨“火狐、谷歌、IE关于`document.body.scrollTop`和`document.documentElement.scrollTop`以及值为0的问题”这一主题时，我们深入分析了浏览器在处理页面滚动位置时的不同行为，尤其是当滚动位置值始终为0时的...

document.body.scrollTop用法: - 使用 `event.clientX` 和 `event.clientY` 获取鼠标相对于视口的位置，但若想得到相对于整个文档的位置，则需加上 `document.documentElement.scrollTop` 或 `document.documentElement.scrollLeft`。 ```...

深入解析：`document.documentElement` 与 `document.body` 的差异及其应用: 在JavaScript的DOM操作中，document.documentElement 和 document.body 是两个非常重要的属性，它们分别代表了文档的不同部分。理解这两者之间的区别对于前端开发者来说至关重要，尤其是在进行页面布局和滚动操作时...

document.body属性.document.body.scrollTop: 5. **浏览器兼容性**：虽然大部分现代浏览器都支持 `document.body.scrollTop`，但在一些老版本的IE浏览器中可能需要使用 `document.documentElement.scrollTop` 来兼容。 6. **CSS替代方案**：有时候，为了避免...

document.documentElement和document.body区别介绍: 在标准模式下，则需要先判断document.documentElement.scrollLeft和document.documentElement.scrollTop是否为0，若是则使用document.body.scrollLeft和document.body.scrollTop。了解了这些区别后，前端开发者在...

document.documentElement && document.documentElement.scrollTop: 在JavaScript中，`document.documentElement` 和 `document.documentElement.scrollTop` 是两个非常重要的属性，它们与网页文档的DOM（Document Object Model）交互，特别是涉及到页面滚动时的行为。本文将深入讲解...

解决VUE中document.body.scrollTop为0的问题: Vue中document.body.scrollTop的值总为零的解决办法最近在做vue的时候监听页面滚动发现document.body.scrollTop一直为0 但是发现document.body.scrollTop一直是0。查资料发现是DTD的问题。页面指定了DTD，即指定...

用javascript地址栏显示源码: - 通过`document.body.innerText = s`将获取到的源代码字符串设置为`<body>`标签内的文本内容。 - 这样做可以将HTML源代码以纯文本的形式显示出来，方便阅读和分析。 #### 示例代码解析 ```javascript ...

js中的如何定位固定层的位置.docx: 但需要注意的是，对于IE5.5及更高版本，需要特别处理`document.body.scrollLeft`和`document.documentElement.scrollLeft`，以及`document.body.scrollTop`和`document.documentElement.scrollTop`，以确保在所有...

document.documentElement document.documentElement.scrollTop: if (document.documentElement && document.documentElement.scrollTop) diffY = document.documentElement.scrollTop; else if (document.body) diffY = document.body.scrollTop else {/*Netscape ...

document.documentElement的一些使用技巧: 这样，`document.documentElement.lastChild`就相当于`document.body`。 5. 查找特定元素：我们可以通过遍历子节点或使用`previousSibling`和`nextSibling`属性来查找特定的元素。例如，`document....

Document.body.scrollTop的值总为零的快速解决办法: 在标准模式下，浏览器倾向于使用`document.documentElement.scrollTop`来获取页面的滚动位置，而不是`document.body.scrollTop`。 `document.documentElement` 指的是HTML文档的根元素，即`<html>`标签。在标准模式...

用document.documentElement取代document.body的原因分析: `screen.width` 等属性提供了关于用户屏幕的信息，而 `availHeight` 和 `availWidth` 则是可用屏幕区域的高度和宽度，这对于布局和弹出窗口的定位很有帮助。总的来说，使用 `document.documentElement` 取代 `...

由document.body和document.documentElement想到的: 在Web开发中，理解和掌握`document.body`和`document.documentElement`的区别至关重要，尤其是在处理页面布局和兼容性问题时。这两个对象分别代表了HTML文档的不同部分：`document.body`指的是HTML文档的实际内容...

javascript获取滚动条高度页面宽度与高度: 这个函数同样通过比较`document.body.clientHeight`和`document.documentElement.clientHeight`来确定可视区域的高度。 #### 四、获取文档总高度文档总高度是指整个网页（包括不可见部分）的高度。这对于判断是否...

javascript 获取网页高度宽度.pdf: 这个函数通过检查 `document.documentElement.scrollTop` 和 `document.body.scrollTop` 来确定滚动条的位置。在不同的浏览器中，这两个属性可能有不同的行为，因此需要进行条件判断来确保兼容性。 ```javascript ...

js+css 实现遮罩居中弹出层(随浏览器窗口滚动条滚动).docx: var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft; document.getElementById('popup').style.top = scrollTop + (document.documentElement.clientHeight - document....

javascript scrollTop正解使用方法: document.documentElement.scrollTop在Chrome里总为0document.body.scrollTop 在IE和firefox里总为01、各浏览器下 window.pageYOffset/document.documentElement.scrollTop/document.body.scrollTop的差异示例：...

document.body.scrollTop 值总为0的解决方法比较常见的标准问题: 解决这个问题的方法是使用`document.documentElement.scrollTop`。下面的示例代码展示了如何修正这个问题： ```javascript window.onscroll = function() { var oFix = document.getElementById("divfix"); oFix....

Global site tag (gtag.js) - Google Analytics