Рандомное количество элементов в DOM и рандомное их расположение

Необходимо рандомно расположить элементы в диапазоне от 0 до 2. И чтобы их расположение было разбросано по экрану рандомно.

Есть код функции.

let IDs = ['red', 'yellow', 'green', 'blue']

function getRandomArbitrary(min, max) {
    return Math.random() * (max - min) + min;
}

function drawCubes() {
    let randomItems = getRandomArbitrary(0, IDs.length-2);
    console.log(randomItems);
    for(let i = 0; i < randomItems; i ++) {
        let pic = document.createElement('img');
        board.appendChild(pic).id = IDs[i];
        board.appendChild(pic).src = `images/${IDs[i]}.jpg`;
    }
}

Дальше следует картинка. По расположению как-то необходимо написать top: ${getRandomArbitrary(10, 90)}% и left: ${getRandomArbitrary(10, 90)}%, но не знаю как это реализовать для каждой картинки в отдельности.

Подскажите, пожалуйста, как это подправить? Надеюсь все пояснил. Если есть вопросы, отвечу в комментариях.

Спасибо!


Ответы (0 шт):