在jQuery库中预加载图像

问题描述

我想用。唯一的问题是当点击下一个加载图片时，需要花费很多时间。我想预先加载下两张图片，当用户点击图片放大图片时。

I would like to use this gallery in my website. The only issue is that when clicking next to load the picture, it takes a lot of time. I would like to preload the next two images, when the user clicks the image to enlarge it.

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

I came across this solution but it's manually coding the image names, but my images are loaded dynamically. Is there any other way I can do it?

推荐答案

这是一个简单的解决方案。您可以向拇指添加单击事件，以便在单击时单击它预加载接下来的三个图像。一旦你在单独的图像导航中预加载下一个图像的某种方式仍然需要解决，但希望这将使你到达那里..

Here's a simple-ish solution. You can add a click event to the thumbs so that when one is clicked it preloads the next three images. Some way of preloading the next image once you are in individual image navigation would still have to be worked out though, but hopefully this will hep you get there..

$("#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();
    }
});

这篇关于在jQuery库中预加载图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！