【问题标题】:How to do the image fade-in effect upon scroll (like mashable.com)如何在滚动时进行图像淡入效果(如 mashable.com)
【发布时间】:2011-02-14 14:22:45
【问题描述】:

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

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

谢谢。

【问题讨论】:

标签: javascript animation fade effect


【解决方案1】:

这是通过 jQuery 插件Lazy Load 实现的。

编辑:这是他们使用的代码:

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

【讨论】:

  • 谢谢,我认为它类似于“延迟加载”和“延迟加载”:)
【解决方案2】:

找到了懒加载的mootools版本http://davidwalsh.name/mootools-lazyload

【讨论】:

    【解决方案3】:

    YUI version 也可用。事实上,Lazy Load 就是受到了它的启发。

    【讨论】:

      【解决方案4】:

      【讨论】:

        【解决方案5】:

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

        但是jQuery Appear Plugin 做的几乎一样! ;-)

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2018-05-04
          • 1970-01-01
          • 2013-07-29
          • 2017-03-18
          相关资源
          最近更新 更多