如何检测html元素是否在浏览器窗口中

How to detect if an html element is in browser window?

本文关键字：是否 浏览器 窗口 元素 html 何检测 检测      更新时间：2023-09-26

可能重复：
如何判断DOM元素在当前视口中是否可见？

有一个HTML页面只有一个div，里面有一个图像

如何检测该元素是否正在查看/是否在浏览器窗口中？

如果我理解正确，你想知道图像是否在视口中，并且还没有滚动。在这种情况下，您需要获取视口和图像高度，获取图像的位置和文档的当前位置。如果你使用的是jquery（我认为这是从标签中得到的），你可以这样做：

var viewportHeight = $(window).height();
var imageOffset = $('img:first').offset().top;
var imageHeight = $('img:first').height;
var documentPosition = $(window).scrollTop();
var visibleArea = documentPosition + viewportHeight; //end of visible area
var imageArea = imageOffset + imageHeight;
if (documentPosition <= imageOffset && visibleArea >= imageArea) {
  //image is entirely visible
}

您可以尝试Element ‘in view’ Event Plugin。

相关文章：