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

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

Answer 2

这plugin似乎可以做你想要的。可能不是你所描述的，但原则似乎是一样的。

Answer 3

看看这个Load Content While Scrolling With jQuery。它在滚动时自动加载新内容。 Mootools还提供lazy load加载滚动。

在滚动到它之后触发某些内容

3 个答案: