滚动页面时显示活动div的JavaScript

Question

我几乎到处搜索但我找不到它。我有像facebook或Instagram这样的提要。我在每5个帖子之后就像其他帖子（比如在Instagram上）放了advirtesment div。问题是当我滚动页面时，如果滚动位置位于advirtesment div，我想添加一个像js in-view这样的类。我怎样才能做到这一点？顺便说一句，当滚动页面底部时我加载其他帖子。 提前谢谢

Answer 1

您可以使用jquery getBoundingClientRect来检查元素是否在视图中，然后向其中添加视图中的类。将div元素传递给以下方法，如果div在视口中，它将返回true

function isElementInView(element){
  var boundry = element.getBoundingClientRect();

  var isInView = boundry.top >= 0 && boundry.left >= 0 &&  
                 boundry.bottom <= (window.innerHeight || $(window).height()) &&  
                 boundry.right <= (window.innerWidth || $(window).width());

  return isInView;
}