提问者:小点点

Javascript随机化图像(不显示相同的图像)


我有一个画廊在我的投资组合网站,它显示了我所有的图片在砖石类型的网格。现在我想把那些图片随机化,而不显示他们超过一次!所以我在画廊里没有同样的照片。

null

// place your images in this array
var random_images_array = [
  'Laundry_Shoot (1).JPG',
  'Laundry_Shoot (5).JPG',
  'Laundry_Shoot (10).JPG',
  'Laundry_Shoot (28).JPG'
];

function getRandomImage(imgAr, path) {
  path = path || 'images/portfolio/'; // default path here
  var num = Math.floor(Math.random() * imgAr.length);
  var img = imgAr[num];
  var imgStr = '<img src="' + path + img + '" alt = "">';
  document.write(imgStr);
  document.close();
}
<!-- END FILTER BUTTONS -->
<div class="gallery">
  <div class="img filterDiv film portret">
    <script type="text/javascript">
      getRandomImage(random_images_array, 'images/portfolio/')
    </script>
  </div>
  <div class="img filterDiv film portret">
    <script type="text/javascript">
      getRandomImage(random_images_array, 'images/portfolio/')
    </script>
  </div>
  <div class="img filterDiv film portret">
    <script type="text/javascript">
      getRandomImage(random_images_array, 'images/portfolio/')
    </script>
  </div>
</div>
</div>

null


共1个答案

匿名用户

你可以使用这个函数来“洗牌”你的数组:

random_image_array.sort(() => Math.random() - 0.5);