Блоки, созданные в случайных местах, без наложения [закрыто] ⇐ Javascript

[Anonymous]

Помогите, пожалуйста! Я уже видел, как сделать от 5 до 20 случайных блоков, но я не могу заставить их не трогать друг друга. Пожалуйста, не объясняйте словами, как это должно работать, но покажите пример кода на Java Script! < /P>

Код: Выделить всё

let bufferZoneCnt = document.querySelector('.bufferZone-cnt');
let bufferZoneCntHeight = bufferZoneCnt.getBoundingClientRect().height;
let bufferZoneCntWidth = bufferZoneCnt.getBoundingClientRect().width;

function generateDiv() {
var dfrag = document.createDocumentFragment();
var count = generateRandom(5, 20);
var i = 0;
for (var i = 0; i < count; i++) {
var div = document.createElement("div");
dfrag.appendChild(div);
}
for (i = 0; i < dfrag.childNodes.length; i++) {
div = dfrag.childNodes[i];
alterDivStyle(div);
}
bufferZoneCnt.appendChild(dfrag);
}
function rndColor() {
var r = ('0' + generateRandom(0, 255).toString(16)).substr(-2), // red
g = ('0' + generateRandom(0, 255).toString(16)).substr(-2), // green
b = ('0' + generateRandom(0, 255).toString(16)).substr(-2); // blue
return '#' + r + g + b;
}

function generateRandom(min, max) {
var number = Math.floor(Math.random() * (max - min)) + min;
return number;
}
function alterDivStyle(div) {
div.style.width = generateRandom(20, 100) + "px";
div.style.height = generateRandom(20, 100) + "px";
let divHeight = parseInt(div.style.height);
let divWidth = parseInt(div.style.width);
div.style.backgroundColor = rndColor();
div.style.color = rndColor();
div.style.position = "absolute";
div.style.border = "solid";
div.style.borderColor = rndColor();
div.style.borderWidth = rndColor();
div.style.borderRadius = generateRandom(0, 10) + "px";
div.innerHTML = "[b]div[/b]";
div.style.top = generateRandom(0, bufferZoneCntHeight - divHeight) + "px";
div.style.left = generateRandom(0, bufferZoneCntWidth - divWidth) + "px";

Я попытался поместить все координаты в массив, а затем запустить каждый раздел массива через цикл, но что -то не работает.

Подробнее здесь: https://stackoverflow.com/questions/796 ... ut-overlay