Question

我目前需要从我的服务器加载123,543个图像，但每个图像都必须通过PHP脚本生成它，问题是我的服务器非常弱并且在加载大约600个图像后崩溃，所以我要求一个Javascript，如果可能的话，将加载2张图像/秒。谢谢。

Answer 1

您可以使用http://www.appelsiini.net/projects/lazyload

$(function() {          
    $("img.lazy").lazyload({
        event : "sporty"
    });
});

$(window).bind("load", function() { 
    var timeout = setTimeout(function() { $("img.lazy").trigger("sporty") }, 5000);
});

Answer 2

假设您要将所有图像放在ID为“container”的容器中，此代码可以解决这个问题：

var images = [
    'image1.jpg',
    'image2.jpg'
],
container = document.getElementById('container');

function loadNextImage(index) {
    var index = index || 0,
        imageUrl = images[index],
        image = document.createElement('img');

    image.src = imageUrl;
    container.appendChild(image);

    if (index + 1  < images.length) {
        setTimeout(function(){loadNextImage(index + 1)}, 500);
    }
}
loadNextImage();

使用JavaScript加载延迟图像

2 个答案: