php - 在图像文件夹和图像文件夹中的子目录中预加载图像

Question

我编造了一些 jquery 和 php 来从图像文件夹中预加载图像。我们的网站已经发展壮大，所有作品集图像都放在主图像目录中的不同文件夹中。我需要一种方法来预加载这些以使我们的投资组合更快。以下是我到目前为止所拥有的。

它遍历图像并将它们放入隐藏的 div 中，以便它们被缓存。

在 preload.php 里面

<div style="display:none">
<?php
 $dirf    = 'images';
 $dir = scandir($dirf);
 foreach($dir as $file) {
 if(($file!='..') && ($file!='.')) {
       echo "<img src='images/$file' />";
   }
 }
?>
</div>

我使用一些 jquery 通过#preload div 将其放在页面上，然后将其删除

 $('#preload').load('preload.php', function () {
    $('#preload').remove();
});

Answer 1

您不需要添加 img 标签，只需动态创建它们：

<script>

<?php
$dirf    = 'images';
$dir = scandir($dirf);
foreach($dir as $file) {
echo "preloads = '";
if(($file!='..') && ($file!='.')) {
    echo "images/$file" . ",";
  }
}
echo "';"
?>

preloads = preloads.split(",")
var tempImg = []

for(var x=0;x<preloads.length;x++) {
    tempImg[x] = new Image()
    tempImg[x].src = preloads[x]
}

setTimeout("tempImg = []", 5000);

</script>