inkShio
@inkShio

Как сдвинуть последние элементы в блоке?

Сделал скрипт, который сдвигает последние элементы при определенных условиях.
Имеются кружки и надо искать элементы имеющие отступ т.е.:
601e647eea964400540785.jpeg
Найденным элементам задавать класс для сдвига и все пересчитывать при resize что бы получилось:
601e64dd11f93661466061.jpeg
В прикрепленном примере все работает, НО возможно кто то подскажет более лучший подход для решения этой задачи.
  • Вопрос задан
  • 44 просмотра
Решения вопроса 1
@antanol
ну, если предположить, что кол-во областей с кругами будет масштабироваться, можно создать функцию detectAll, которая будет сама перебирать все wrap-ы, и вызывать им функцию detect:
function detectAll(container){
  let detectedItems = document.querySelectorAll(container);
  for (let item of detectedItems){
    detect(item.classList[1]);
  }
}
window.onload = function () {
  detectAll(".wrap");
  window.onresize = function () {
    detectAll(".wrap");
  };
};

Хотя моё "classList[1]" лучше заменить чем-то, ориентирующемся на имя класса. Типа, если содержит "js-", то вызвать
В этом случае ещё изменяется первая строка в detect:
function detect(className) {
  const parent = document.querySelector(`.${className}`);


Строки 11-19. Тут две проверки выполняют одно действие, т.е. можно написать вот так:
if ((prevItem.length == 0) || (prevItem < currItem)) {
      obj.push({ a: [item] });
    } else {
      obj[obj.length - 1].a.push(item);
    }

+ таким образом мы избавимся от лишней вложенности

Строка 29.
Тут избыточны true и false. Само по себе равенство вернёт эти ответы.
Т.е. вот две аналогичных переменных:
let even = ((countPenult - countLast) % 2 == 0);

и ваша
let even = ((countPenult - countLast) % 2 == 0 ? true : false);
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы