使用CSS预加载图像 [英] Preload images using css

问题描述

与html/head内的一些js代码相比，这是一种可接受的预加载图像的方式

Is this an acceptable way to preload images, compared to some js code inside of html / head

body:after{
    display:none;
    content:
    url(img1.jpg)
    url(img2.jpg)
    ...
}

js方式

$.preload = function() {
  for (var i = 0; i < arguments.length; i++) {
    $("<img />").attr("src", arguments[i]);
  }
}

$.preload("img1.jpg","img2.jpg");

推荐答案

我认为只要图像不是动态生成的，该方法就可以工作.仅使用CSS进行预加载的唯一问题似乎是图像是随页面一起下载的，而不是随页面一起下载的.您可以在页面加载结束后触发JavaScript事件.

I suppose that method would work, as long as the image isn't dynamically generated. The only issue with preloading using just CSS seems to be that the images download WITH the page, not after it. You can trigger the JavaScript event after the pageload is over.

进一步阅读: http://perishablepress.com/3-Ways-preload-images-css-javascript-ajax/

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