jQuery图像预加载

Question

我有一个Web应用程序，其中有一些图像。

将在开始时在我的页面中显示叠加层，并且将在所有图像上自动淡出。

我需要这样的东西

它粗糙的代码

var image1="image1.jpg";
var image2="image2.jpg";
var image4="image4.jpg";

image1 & image2 & image4 loaded then fadeout #preload and show content.

请帮帮我...我试过这个......但是没有工作..

var img1 = new Image();
img1.src = "../images/wall.jpg";

img1.onload = function() {
    alert("loaded");
};

Answer 1

var images_loading = $('img').length;
$('img').load(function(){
  if(!--images_loading) {
    // all images loaded
  }
});

请注意，您无法使用display:none隐藏图像。

使用display:none将阻止浏览器下载图像。 用户visibility:hidden 。

Answer 2

试试这个小提琴 。 我使用了大多数原始的javascript。

如果你愿意，你可以使用jQuerys .load更换onload功能，并追加更换appendChild