我如何检测一个元素滚动到视窗

How can I detect when an element scrolls into the viewport

本文关键字：元素 滚动 一个 何检测 检测      更新时间：2023-09-26

我有一个横幅广告在我的网站底部。我使用谷歌分析事件来跟踪印象。问题是，如果用户不滚动到底部，他们将看不到横幅。所以记录印象会导致不准确，除非我能等到横幅出现在视窗中。

我如何检测我的横幅广告(与#footer-banner的id)已进入视口?我更希望它只在整个横幅的高度可见时才被检测到。

使用jQuery可以:

function isInView() {
  var y = $('foot-banner').position().top;
  var windowY = $(window).scrollTop();
  return y > windowY && y < windowY + $(window).height();
}

这个函数可以在触发滚动事件时使用:

var impressionRecorded = false;
$(document).scroll(function() {
  if (isInView() && !impressionRecorded) {
     impressionRecorded = true;
     // record impression
  }
});

我使用插件:https://github.com/thesmart/jquery-scrollspy

相关文章：