Сделал курсор прозрачным, создал квадратик и перемещаю его по координатам курсора. Но появилась проблема - когда пытаюсь кликнуть, то получаеться что кликаю на квадрат, а не на тот элемент, который мне надо. Z-index нужно оставить 999, потому что курсор тогда скрывается за некоторыми элементами. Как решить такую проблему?
export default class CustomCursor {
size = 128;
cursor = null;
constructor() {
this.cursor = document.createElement('div');
this.cursor.style.width = `${this.size}px`;
this.cursor.style.height = `${this.size}px`;
this.cursor.style.background = 'black';
this.cursor.style.position = 'absolute';
this.cursor.style.zIndex = 1;
}
activate() {
document.body.prepend(this.cursor);
document.documentElement.style.cursor = 'none';
document.body.addEventListener('mousemove', e => {
this.cursor.style.left = `${e.clientX - (this.size / 2)}px`;
this.cursor.style.top = `${e.clientY - (this.size / 2)}px`;
});
}
}
