javascript - 滚动到它后，当它变得可见时触发

Question

我在某个地方见过这种效果，但我不记得它叫什么了。我认为这是一个 jQuery 插件，不能确定。

基本上，每次向下滚动页面时，每当您看到一篇新文章时，它就会变为事件状态，您可以应用各种漂亮的效果，而当它滚出时，它就会变为非事件状态。

希望这可以解释我在寻找什么:

#<article>              #
#<h2> Entry 1</h2>      #
#<p> lorem ipsum</p>    # // this area is out of the screen
#</article>             #
#<article class=active> #
#<h2> Entry 2</h2>      #
------------------------- // from here one this area is visible
|<p> lorem ipsum</p>    |
|</article>             | // scroll past here the previous article loses .active 
|<article>              | // and this article becomes .active
|<h2> Entry 3</h2>      |
|<p> lorem ipsum</p>    |
|</article>             |
|<article>              |
|<h2> Entry 4</h2>      |
|<p> lorem ipsum</p>    |
|</article>             |

编辑 基本上我的目标是文章列表真的很小(图像和字体大小)，但最上面的文章在变得可见时会动画到全尺寸，而当另一篇变得可见时会再次缩小活跃。

Answer 1

我看到它主要用于图像:http://www.appelsiini.net/projects/lazyload

您正在寻找的是操纵视口(viewport)(用户可以看到的网页部分)。尽管我链接到的插件是用于图像的，但您可以使用 http://www.appelsiini.net/projects/viewport制作适合您的系统。