检测窗口中呈现的div,以实现类似Google-Reader的自动标记读取？

Question

在"扩展"视图中使用Google阅读器和浏览RSS条目时,一旦在屏幕上显示div的某个百分比,条目将自动标记为"已读"(在以下情况下很难分辨出必须显示的百分比)谷歌读者).因此,当我逐行向下滚动时,javascript代码可以确定a)条目在可见窗口中呈现并且b)某个量是可见的,并且当满足这些条件时,状态被切换为读取.

有谁知道该功能是如何实现的？具体来说,这里有没有人知道如何判断一个div是否已滚动查看div中有多少可见？

顺便说一下,我正在使用jQuery,所以如果有人有任何jQuery特定的例子,他们将非常感激.

Answer 1

真正的技巧是跟踪滚动条在包含项目的元素中的位置。这是我曾经编写过的一些代码：http://pastebin.com/f4a329cd9

您可以看到，当您滚动时，焦点会发生变化。您只需向处理每个焦点更改的函数添加更多处理程序代码即可。它可以双向滚动，也可以通过在滚动条上单击鼠标右键来实现，简单的鼠标跟踪不会给您带来这种效果（尽管在这种情况下，由于示例元素的大小都相同，文本也相同，所以很难说出来）它确实已经滚动了）。另一个问题是当容器触底时该怎么办。我现在的解决方案只适用于FF。如果你想让它在 IE 中看起来不错，你必须使用一个与背景混合的虚拟元素，就像我在代码中注释掉的那样。