Координаты указателя для оверлея подсказок: клиентские и смещение относительно контейнера
Разбор задачи
Для простого лейбла рядом с курсором достаточно clientX/Y. Если нужен учёт скролла внутри вложенного блока каталога, вычитаем getBoundingClientRect целевой обёртки.
function attachPointerHud(layer) {
let ticking = false;
layer.addEventListener('mousemove', (ev) => {
if (!ticking) {
window.requestAnimationFrame(() => {
const rect = layer.getBoundingClientRect();
const posX = ev.clientX - rect.left + layer.scrollLeft;
const posY = ev.clientY - rect.top + layer.scrollTop;
layer.dataset.pointerX = String(Math.round(posX));
layer.dataset.pointerY = String(Math.round(posY));
ticking = false;
});
ticking = true;
}
});
}Не забываем blur и pointer-events:none у подсказки, если она не должна блокировать hover соседних карточек.
Замечания перед выкладкой
Вносите правки только через среду с бэкапом и понятным diff. Если сниппет идёт в шаблон на Битрикс, проверьте конфликт с уже подключённым jQuery/UI и включите «отложенный» запуск там, где длинный главный файл может обрезать DOMContentLoaded.
Не хотите копаться сами?
Починю за 1-3 дня. Без предоплаты — оплата по результату.
15+ лет опыта с 1С-Битрикс · Без предоплаты · 7 дней гарантии