JS计算元素的距离

暮尘Pluto
  • 507

图片描述

如图所示

  • 黑色框是窗口大小,也就是viewport。

  • 红色虚线是整个页面的大小,其中一部分已经滚动超出viewport 一部分还未显示出来

  • 红色虚线框内部的蓝绿色虚线是一个个的元素li

  • 现在要获取某个元素到viewport顶部的距离,即红色箭头所指的那部分距离,应该如何计算。

可以使用jquery

回复
阅读 2.7k
3 个回答
✓ 已被采纳

document.getElementById('xx').getBoundingClientRect().top
题主要的是这个哈,刚好前阵子也用到过记得。

设元素为x,x距离viewport的距离为:x.offsetTop - document.documentElement.scrollTop;

$('#element').offset().top-$(window).scrollTop();

Demo

你知道吗?

宣传栏