Как можно рандомно вставить картинки в разные места на javascript?

1
2
3
4
5
6
7
8
9

    Рандомное вставление картинок
    


    

    

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

#container {
  display: flex;
  flex-wrap: wrap;
}

img {
  width: 150px;
  height: 150px;
  object-fit: cover;
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17

window.addEventListener('load', function() {
    var container = document.getElementById('container');
    var images = ['image1.jpg', 'image2.jpg', 'image3.jpg', 'image4.jpg', 'image5.jpg']; // список ваших картинок

    for (var i = 0; i < 10; i++) { // количество размещаемых картинок
        var img = document.createElement('img');
        var randomImage = images[Math.floor(Math.random() * images.length)]; // случайная картинка из списка
        img.src = randomImage;
        
        var randomPositionX = Math.floor(Math.random() * (window.innerWidth - 150)); // случайное положение по оси X
        var randomPositionY = Math.floor(Math.random() * (window.innerHeight - 150)); // случайное положение по оси Y
        img.style.left = randomPositionX + 'px';
        img.style.top = randomPositionY + 'px';
        
        container.appendChild(img);
    }
});