页面加载时不要加载某些图像

时间:2013-07-22 16:08:21

标签: javascript jquery html image onload

我有一个网页,一个简单的index.php。使用jquery,我设法设置了5个单独的菜单。不幸的是,我必须在我的画廊中使用150个缩略图,每当我重新加载页面时,所有这些图片都需要加载,这需要5-6秒。我试图设置Lazy Load jquery插件,但它对我来说不起作用(它是为滚动网站编写的,我猜...我的不是那样)。

我正在考虑编写一个脚本,这会阻止所有这些图像加载,但我甚至不知道如何开始。我的观点是,缩略图只应在用户点击图库链接时加载(虽然这是非常相同的php页面)。

1 个答案:

答案 0 :(得分:1)

只需将图片的网址放在一个单独的属性中:

<img data-realsrc='realsrc'>

然后当你需要加载它们时:

$(img).attr('src', $(img).data('realsrc'));

以上是一般实施原则。有关小提琴的真实例子:http://jsfiddle.net/3UrUZ/

BTW做你做的不是一个好习惯。我建议你使用CSS Sprites而不是很多图片。 :)还有很多spritees生成器来帮助创建它们。