Question

我有一个简单的褪色幻灯片放映效果很好，但运行到大约300张图像。一段时间后它开始跳跃并丢失一些，我认为这是由于加载的图像太多。有没有一种方法可以卸载＆＃39;图像一旦被查看，或者它可能是其他东西？

Answer 1

在显示幻灯片放映之前加载所有图像，或跳过未加载的图像。

你可以这样做，例如：

var images = ['./path1.jpg', './path2.jpg']; // Array with all images
var imageCount, imagesLoaded, c;

imageCount = images.length; // Get images count
imagesLoaded = 0;

for (c = 0; c < imageCount ; c++){ // Loop thorough all images
  var image = document.createElement('img'); // Create img tag
  image.setAttribute('src', images[c]); // Set src attribute
  document.body.appendChild(image); // Add img tag to body

  image.onload = function() { 
    imagesLoaded++; // Add loaded image to loaded images count

    console.log('Loaded: ' + imagesLoaded + '/' + imageCount); // debug

    if (imagesLoaded == imageCount){ // when all images loaded   
      // Start your slideshow
    }
  }
}

Javascript幻灯片放映

1 个答案: