当前位置: 首页 > 面试题库 >

JavaScript获取滚动的窗口X / Y位置

司徒元明
2023-03-14
问题内容

我希望找到一种方法来获取当前可见窗口的位置(相对于总页面宽度/高度),以便可以将其强制从一个部分滚动到另一部分。但是,要猜测哪个对象对您的浏览器拥有真正的X
/ Y,似乎有很多选择。

为了确保IE 6 +,FF 2+和Chrome / Safari能正常工作,我需要选择以下哪两项?

window.innerWidth
window.innerHeight
window.pageXOffset
window.pageYOffset
document.documentElement.clientWidth
document.documentElement.clientHeight
document.documentElement.scrollLeft
document.documentElement.scrollTop
document.body.clientWidth
document.body.clientHeight
document.body.scrollLeft
document.body.scrollTop

还有其他吗?一旦知道窗口在哪里,就可以设置一个事件链,该事件链将缓慢调用window.scrollBy(x,y);直到到达所需的位置。


问题答案:

jQuery(v1.10)用来查找的方法是:

var doc = document.documentElement;
var left = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
var top = (window.pageYOffset || doc.scrollTop)  - (doc.clientTop || 0);

那是:

  • window.pageXOffset首先进行测试,并使用它(如果存在)。
  • 否则,使用document.documentElement.scrollLeft
  • 然后减去document.documentElement.clientLeft它是否存在。

的减法document.documentElement.clientLeft/
Top似乎只需要正确的地方已应用边界(不填充或利润率,但实际边界)的根元素的情况下,在那个,可能只在某些浏览器。



 类似资料:
  • 问题内容: 我想知道如何相对于浏览器窗口获取HTML元素(例如和在JavaScript中)的X和Y位置。 问题答案: 正确的方法是使用: Internet Explorer自从你很可能就一直在支持此功能,并且最终在CSSOM Views中对其进行了标准化。所有其他浏览器很早以前就采用了它。 一些浏览器还返回height和width属性,尽管这是非标准的。如果你担心与旧版浏览器的兼容性,请查看此答案

  • 问题内容: 我正在尝试获取活动窗口的标题。该应用程序是一个后台任务,因此如果用户打开Eclipse,该函数将返回“ Eclipse- blabla”,因此它不会获取我自己窗口的窗口标题。我正在使用PyQt4在Python 2.6中进行开发。 我当前的解决方案是从SO的旧答案中借用并稍作修改的,看起来像这样: 它适用于大多数窗口,但不是全部。例如,它找不到我的kopete聊天窗口,或者找不到我当前正

  • 问题内容: 我做了一个函数,应该在div中单击的位置上添加一个项目。现在,此功能的问题在于,每次单击时,它都会采用文档的x&y位置,而不是div内的x&y位置。因此,我真正想要的是div的左上角应给出x = 0和y = 0,但是我不知道这是否可行吗?我想还有另一种方法。 问题答案: 你需要改变,以和对 您没有添加模板定义,但是为了以防万一,我将添加它:

  • 问题内容: 我正在尝试使用JavaScript检测浏览器滚动条的位置,以确定当前视图在页面中的位置。我的猜测是,我必须检测轨道上的拇指在哪里,然后检测拇指的高度占轨道总高度的百分比。我是不是过于复杂了,还是JavaScript提供了比这更简单的解决方案?任何想法代码明智? 问题答案: 您可以使用和获取分别滚动的垂直和水平偏移。可如果你关心整个页面。如果需要百分比,可以将其与和(再次可能是主体)进行

  • 我有一个页面的正文在滚动。也就是说,body上的滚动事件侦听器起作用。但是,window和document上的滚动侦听器不会激发。 问题是,即使body是滚动的,$(“body”).scrolltop()始终返回0。我循环遍历了body的所有子级,没有一个scrollTop()大于0。有些孩子有溢出:隐藏,但应该不会影响滚动顶部,我猜。 我删除了高度:100%根据这个问题,我也经历了这个问题。 我

  • 返回当前页面的滚动位置。 如果浏览器支持 pageXOffset 和 pageYOffset ,那么请使用 pageXOffset 和 pageYOffset ,否则请使用 scrollLeft 和 scrollTop 。 你可以省略 el 参数,默认值为 window。 const getScrollPosition = (el = window) => ({ x: el.pageXOffs