在启动index.html之前预加载所有图像

时间:2016-10-26 08:30:17

标签: javascript jquery html css preload

我想在显示我的index.html之前预先加载带有图像的不同文件夹。如果我能在这个过程中用加载器和文本显示我的div,它将是完美的

我从这里找到了这部分代码: http://www.javascriptkit.com/javatutors/preloadimagesplus.shtml

并使用我的不同链接更新它,是否可以开始?

function preloadimages(arr) {
  var newimages = [],
    loadedimages = 0
  var postaction = function() {}
  var arr = (typeof arr != "object") ? [arr] : arr

  function imageloadpost() {
    loadedimages++
    if (loadedimages == arr.length) {
      postaction(newimages) //call postaction and pass in newimages array as parameter
    }
  }
  for (var i = 0; i < arr.length; i++) {
    newimages[i] = new Image()
    newimages[i].src = arr[i]
    newimages[i].onload = function() {
      imageloadpost()
    }
    newimages[i].onerror = function() {
      imageloadpost()
    }
  }
  return { //return blank object with done() method
    done: function(f) {
      postaction = f || postaction //remember user defined callback functions to be called when images load
    }
  }
}

preloadimages([
  'http://www.domain.com/wp-content/uploads/book0/',
  'http://www.domain.com/wp-content/uploads/book1/',
  'http://www.domain.com/wp-content/uploads/book2/',
  'http://www.domain.com/wp-content/uploads/book3/',
  'http://www.domain.com/wp-content/uploads/book4/'
]).done(function(images) {})

0 个答案:

没有答案