懒加载插件加载图像作为用户滚动？

我真的很喜欢懒惰的加载插件，我很内疚，它不适用于新的浏览器。懒加载插件加载图像作为用户滚动？

是否有反正我可以写我自己的代码，不加载图像下面的图像，直到用户滚动？

<img _src="/fullscreen/img/You are everywhere 2.png" class='lazyLoad' /> 

jQuery('.lazyLoad').each(function(){ 
     var _elm= jQuery(this); 
     _elm.attr('src',_elm.attr('_src')); 

     //on DOM ready loop through each 
     //image with class=lazyLoad and add src attribute to it. 
})

这将是巨大的，如果我能得到这个钉，真是可惜the appelsiini site不支持任何更长的时间。

我发现了一个可以在所有浏览器中工作的网站http://haw-lin.com/，它使用了一个非常类似于http://www.appelsiini.net/projects/lazyload的插件脚本。没有MIT许可证，我觉得很难破译。

你推荐什么jQuery图像延迟加载插件？

来源

2011-01-06 Tara Irvine

什么浏览器不起作用？ – 2011-01-06 18:27:50

appelslini.net上的那个似乎在firefox和chrome和Safari – dstarh 2011-01-06 19:05:07

Safari中工作得很好，虽然这是我的测试失败，我被告知这是一个错误。现在我不太确定 – 2011-01-12 19:43:39

jQuery image lazy load plugin的演示页面在Mac上的FF3.6上似乎不起作用。我正在用Firebug的Net标签查看HTTP请求，我可以看到所有加载的图像。

你可以看看这个名为JAIL的插件，它完美地工作（尽管需要一些HTML更改）。我特别建议看看这些例子。

来源

2011-01-09 09:37:07 sebarmeli

如果你看看forks of jquery_lazyload in github，其中一些address the issues与newer browsers。

来源

2011-01-06 19:06:20

你可以试试这个jQuery插件我写了一个使用HTML注释来延迟加载HTML的任意位，包括图片：

jQuery Lazy Loader Blog Post

jQuery Lazy Loader Plugin Page

下面是一个例子：

<pre class=”i-am-lazy” ><!– 
    <img src=”some.png” /> 
–></pre> 

<pre class=”i-am-lazy” ><!– 
    <div>Any, html css img background, whatever. <img src=”some.png” /> </div> 
–></pre> 

<script type=”text/javascript” src=”jquery.lazyloader.js” ></script> 
<script type=”text/javascript” > 
$(document).ready(function() 
{ 
    $(’pre.i-am-lazy’).lazyLoad(); 
}); 
</script>

因此，基本上你用惰性加载占位符标签和内部HTML评论。当占位符在视口中变为可见时，它将被替换为注释内的HTML字符串。

您可以对占位符使用任何标记，但是我喜欢pre，因为只有里面只有注释才呈现为0维。

来源

2011-04-20 14:21:39

懒加载插件加载图像作为用户滚动？

回答

相关问题