ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript-获取元素相对于最顶部窗口的位置的函数

2019-11-01 01:34:23  阅读:140  来源: 互联网

标签:iframe position javascript jquery


可能已经有人问过这个问题,但是我找不到要解决的方法.

我试图找到事件对象上属性的神奇组合,以及滚动和其他偏移量,以便为我提供元素相对于iframe中可能存在或不存在的最顶部窗口的位置.我这样做是为了淡化被鼠标悬停在元素右侧的小图像(绝对定位).

我正在尝试获取jQuery悬停事件内的位置.我尝试了以下属性的不同组合:

$(element).position()
$(element).offset()
$(element).scrollTop()
$(element).scrollLeft();
$(document).scrollTop();
$(document).scrollLeft();
event.clientX
event.clientY
event.pageX
event.pageY

是否有人可以提供这些数字的函数或方程式?

解决方法:

在现代浏览器中,最简单的方法是document.querySelector(‘.foo’).getBoundingClientRect(),该方法返回的和对象包含属性top和left,这是元素相对于视口的偏移量.

上面的方法在IE> = 5中有效,并且有一些简单的技巧,见http://ejohn.org/blog/getboundingclientrect-is-awesome/

另外,如果页面上有jQuery,则可以使用jQuery.offset()方法.它将在整个浏览器中始终返回偏移量的元素.

从< iframe>获取所述元素的偏移.取决于您尝试从何处获取位置的技巧可能会有些棘手,即脚本与可能在< iframe>中的元素在同一页面上运行,还是在< iframe>中的元素在根页面中运行;

如果是第一种情况,则只要您将元素重新放置在< iframe>内的某处,就无需执行任何操作.因为您已经有正确的偏移量.

如果您不在< iframe>您需要考虑iframe.getBoundClientRect()偏移量,因为element.getBoundingClientRect()相对于其自己的视口(< iframe>)

标签:iframe,position,javascript,jquery
来源: https://codeday.me/bug/20191101/1980083.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有