Подскажите, как правильно расставить абсолютные координаты картинкам, исходя из их html-кода. У меня они расставлены буквально для каждой, если картинок будет гораздо больше, код получается нерациональный. Вот часть кода:
<body style='min-height: 100vh'>
<img src='1.png'>
<img src='2.png' width=50>
<img src='3.png' width=100>
<img src='4.png' style='padding-left: 50px'>
<script>
"use strict";
window.addEventListener('load', pos, false);
function pos(eo) {
eo = eo || window.event;
let elems = document.querySelectorAll('img');
for (var i = elems.length - 1; i >= 0; i--) {
let elem = elems[i];
elems[0].style.left = "10px";
elems[0].style.top = "60px";
elems[1].style.left = "160px";
elems[1].style.top = "160px";
elems[2].style.left = "260px";
elems[2].style.top = "90px";
elems[3].style.left = "400px";
elems[3].style.top = "10px";
elem.style.position = 'absolute';
}
}
</script>
Благодарю всех за помощь!
data-x="..."
data-y="..."
. Расставлять в цикле. А ежели какие-то хитрые условия, то нужно сначала эти условия объяснить в вопросе.