代码之家 › 专栏 › 技术社区 › Mahmoud Al-Qudsi

如何在滚动时使图像淡入效果(如mashable.com)

effect fade animation javascript

8

Mahmoud Al-Qudsi · 技术社区 · 15 年前

我想知道mashable.com上图像的淡入效果(请参见 http://mashable.com/2009/08/14/google-android-logo-remixes/ 例如)

当您滚动到图像时,它会淡入。它不会在页面加载时淡入淡出,只会在屏幕上显示项目的实际外观时才会淡入淡出。

谢谢。

5 回复 | 直到 12 年前

1

9

Vincent 15 年前

它是通过jquery插件实现的 Lazy Load .

编辑:下面是他们使用的代码:

if(! navigator.userAgent.toLowerCase().match('ipad')){
  $('#primary img').lazyload({effect:'fadeIn',placeholder:'/wp-content/themes/v6/_base/img/blank.png'});
}

2

1

RRG 15 年前

找到了Moootools版本的Lazyload http://davidwalsh.name/mootools-lazyload

3

1

Tárcio Zemel 13 年前

不幸的是,懒惰的加载插件在大多数实际的浏览器中都不起作用, according the own author says in the official web site .

但是 jQuery Appear Plugin 做几乎相同的事情!;-)

4

1

alain.janinm 13 年前

有一个 jQuery version of lazyload 也是。

5

0

Drew Noakes 14 年前

一 YUI version 也可以使用。事实上,懒惰的负荷是由它所激发的。