Событие «mousemove» в Javascript иногда не срабатывает

Событие «mousemove» в Javascript иногда не срабатывает

У меня есть пример codepen.io, над которым я работал, чтобы создать складную боковую панель из чистого js, которая также может быть изменяемого размера. Пример работает в 70% случаев, но очень часто изменение размера панели приводит к тому, что события «mousemove» не генерируются, и панель просто зависает (т.е. не отслеживает положение мыши x). Я не могу найти проблему сам, задаваясь вопросом, может ли кто-нибудь пролить свет на этот вопрос. Возможно, есть лучший подход к добавлению / удалению прослушивателей событий для такого рода работы, о котором я не задумывался.

Мясо логики js выглядит следующим образом:

 const divider = document.querySelector(".divider"); const startSlide = event ={amp}gt; { const viewportWidth = window.visualViewport.width; const width = viewportWidth - event.clientX; divider.style.width = `${width}px`; }; const stopSlide = event ={amp}gt; { window.removeEventListener("pointermove", startSlide, true); window.removeEventListener("pointerup", stopSlide, true); }; const initSlide = event ={amp}gt; { window.addEventListener("pointermove", startSlide, true); window.addEventListener("pointerup", stopSlide, true); }; divider.addEventListener("pointerdown", initSlide, true); 

Чтобы воспроизвести проблему, просто попытайтесь сдвинуть панель делителя влево и вправо пару раз, в конце концов, это приведет к ошибке!

сломанный пример кода

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector