Question

我需要一种通过vanilla JS或jQuery预加载背景图像的方法。我使用纯CSS3 bg库，这是一个普通的ul，每个li代表完整的bg图像。

没有img标签，每个li都使用css background-image属性。我有四个画廊，每个画廊都可以根据要求加载AJAX。

如果有人可以指出一些示例，或某些脚本可以帮助我为每个图库预加载图像，那么当加载图库时，图像已经预先加载。

您可以在http://www.madebym.net/test/index.html

看到测试网站

只有第一组链接有效，每个链接指向新图库。

Answer 1

我有一个全局实用程序函数，用于处理任何图像预加载（您可以将图像数组传递给它）。

    $.preloadImages = function () {
        for (var i = 0; i < arguments.length; i++) {
            $('<img>').attr('src', arguments[i]);
            // For testing purposes: 
            //console.log('\n\u2713 Successfully Preloaded Image :: ');
            //console.log($('<img>').attr('src', arguments[i]));
        }
    }

用法将是：

    $.preloadImages('test.jpg', 'test2.jpg'); // put all your images in there

但基本上你只是创建一个空白$('img')。希望有所帮助！

需要预加载背景图像的方法

1 个答案: