查找哪些元素（div）已显示在带滚动条的页面中

Question

所以这是我的页面

<Style>.item{ width :200px ; height:200px ; background-color:red ; float:right ; margin : 10px}</style>

<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>

这是完整的代码

http://jsfiddle.net/gup3o1ap/1/

你可以看到页面上有很多div.item，页面有一个大滚动条，我想知道用户看过哪个.item，所以基本上我需要知道最后一项是否可见在页面上（之前的.items已经显示）

所以我可以计算滚动到达页面末尾的时间

$(window).scroll(function() {

   if($(window).scrollTop() + $(window).height() > $(document).height() - 200) {
      console.log('at the end' );
   }
});

但我不知道如何才能找到页面上显示的最后一个元素

Answer 1

http://api.jquery.com/scrolltop/

scrollTop（）为您提供页面上方的高度，因此您可以将其与元素高度和窗口高度一起使用（并进行一些数学运算）以查找已显示的元素。