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

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

  •  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    14 年前

    找到了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 也可以使用。事实上,懒惰的负荷是由它所激发的。