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

时间:2010-10-09 04:43:29

标签: javascript jquery

我在某处看到了这种效果,但我记不起它的名字。我认为这是一个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>             |

编辑基本上我的目标是文章列表非常小(图片和字体大小),但最顶层的文章在变得可见时会动画为完整大小,而当另一个文章变为可见时会再次缩小活性

3 个答案:

答案 0 :(得分:2)

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

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

答案 1 :(得分:2)

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

答案 2 :(得分:1)

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