Не удается получить ближайший элемент для удаления после перетаскивания с помощью elementFromPoint

#javascript

Вопрос:

document.elementFromPoint определяет элемент, до или после которого должен быть вставлен перетаскиваемый элемент. Когда я использую этот метод, он возвращает перетаскиваемый элемент, а не тот, который должен быть определен. Почему этого не происходит и как мне исправить ошибку?

  evt.preventDefault();
 if (!draggedEl) {
   return;
 }
 draggedEl.style.left = `${evt.pageX - draggedEl.offsetWidth / 2}px`;
 draggedEl.style.top = `${evt.pageY - draggedEl.offsetHeight / 2}px`;
 **const closest = document.elementFromPoint(evt.clientX, evt.clientY);**
 const { top } = closest.getBoundingClientRect();
 if (evt.pageY > window.scrollY   top   closest.offsetHeight / 2) {
   // closest.style.paddingBottom = `${draggedElWidth}px`;
 } else {
   // closest.style.paddingTop = `${draggedElWidth}px`;
 }
});
 

Полный код: https://github.com/tati-simonenko/ahj6/blob/master/src/js/taskWidget.js

Комментарии:

1. elementFromPoint получает только самый верхний элемент в указанной точке, который будет перетаскиваемым элементом. Вместо этого вы можете попробовать использовать elementsFromPoint , который получает все элементы в определенный момент, а затем просто выбирает нужный элемент по имени класса или чему-либо еще.