Перекрывающиеся элементы HTML действуют как отдельные на Etsy - как? ⇐ Javascript

[Anonymous]

Недавно я попытался воспроизвести карусель изображения со страницы продукта на [etsy.com]. (https://www.etsy.com/)
Существует два элемента HTML, которые визуально перекрывают друг друга, но броузер обрабатывает их, как будто они были отдельными, не топальные элементы. JavaScript для применения: Hover Pseudo-Class на элементе. < /P>
Вот структура DOM:
DOM Структура с проблемой < /p>

Прокрутка вверх /прокрутка вниз отвечает за автоматическую карусель на Hover. Images. /> Это в основном - я не могу понять, просто ли я здесь нуб или на самом деле что -то более глубокое за этим поведением. Было так разочаровывает дальнейшее исследование. Я даже спросил три разных ИИ и заставил их искать в Интернете. Я попытался спросить об этом в разных рамках, возможных обходных путях JavaScript и уловках CSS (например, e-events: none), но ничего не сработало. Мышиные события в элемент изображения внизу. (Я использую Document.ElementsFrompoint (E.Clientx, E.Clienty), чтобы найти элемент изображения.)
Но, как вы можете себе представить, это вообще не является родным поведением. Это не запускает: парить псевдо-класс на изображении; Вместо этого я просто добавляю классы CSS вручную на мыши.

Подробнее здесь: https://stackoverflow.com/questions/797 ... n-etsy-how