Question

如何让网页加载数千甚至数百万张不同的图片作为HTML背景，而不会导致浏览器崩溃或放慢速度？

可以动态创建图像，也可以将图像链接到其文件夹。我能够为每个画布最多1000个图像做到这一点，并添加更多的画布，但在30画布，这是30,000个图像浏览器停止响应（减慢）。

仅供参考：图像必须一次显示。

<html>
 <body>
      <script>
      var cInt=0;
      var loopCInt=0;
      while (loopCInt<3){
       var canvasName = document.createElement("canvas");
       canvasName.setAttribute('width', "1000");
       canvasName.setAttribute('height', "1000");
       var canvasIdName="myCanvas"+cInt;
       canvasName.setAttribute('id', canvasIdName);
       document.body.appendChild(canvasName);
        var c = document.getElementById(canvasIdName);
        var ctx = c.getContext("2d");
        var i = 0;
        var right=0;
        var tops=0;
        var goDown=0;
        while (i <= 1000) {
          ctx.beginPath();
          ctx.rect(right, goDown, 30, 30);
          ctx.fillStyle = '#'+Math.random().toString(16).slice(-6);
          ctx.fill();
          i++;
          right=right+30;
          tops++;
          if (tops==30){
            goDown=goDown+30;
            right=0;
            tops=0;
          }
        }

      loopCInt++;
      cInt++;
    }
</script>
</body>
</html>

Answer 1

加载1000张图片很难，但如果你需要经常更改的背景。您可以从（1到1000）为图像编号。然后使用javascript随机选择10个图像。在这种情况下，访问者将在每个会话中看到10个不同的背景。

如何显示数千/数百万种不同的背景图像

1 个答案: