javascript - 在 jQuery 库中预加载图像

Question

我想使用 this gallery在我的网站上。唯一的问题是点击下一步加载图片时，需要花费很多时间。我想在用户点击图片放大时预加载接下来的两张图片。

我遇到了 this solution但它是手动编码图像名称，但我的图像是动态加载的。还有其他方法吗？

Answer 1

这是一个简单的解决方案。您可以向缩略图添加点击事件，以便在点击一个缩略图时预加载接下来的三个图像。不过，在您进入单个图像导航时预加载下一张图像的某种方式仍然需要解决，但希望这会帮助您到达那里。

$("#content img").on("click",function(){ // use .live instead if you are using an older version of jQuery
    var next = $(this).next();
    for (var i = 0; i < 3; i++)
    {
        var img = new Image();
        img.src = next.attr("alt");
        next = next.next();
    }
});