가로 메뉴바 마우스 스크롤 이벤트
본문
가로메뉴 마우스 드롭하여 메뉴 이동 구현 중인데 메뉴가 이동은 하는데
이동하고 클릭했던걸 놓으면 링크로 이동해버리네요
이동중엔 이동만 하고 끝냈으면 하는데 클릭이 되어 메뉴어 들어가 집니다.
const slider = document.querySelector('#gnb_1dul');
let isMouseDown = false;
let startX, scrollLeft;
slider.addEventListener('mousedown', (e) => {
isMouseDown = true;
slider.classList.add('active');
if(!isMouseDown) return false;
startX = e.pageX - slider.offsetLeft;
scrollLeft = slider.scrollLeft;
});
slider.addEventListener('mouseleave', () => {
isMouseDown = false;
slider.classList.remove('active');
});
slider.addEventListener('mouseup', () => {
isMouseDown = false;
slider.classList.remove('active');
});
slider.addEventListener('mousemove', (e) => {
if(!isMouseDown) return;
e.preventDefault();
const x = e.pageX - slider.offsetLeft;
const walk = (x - startX) * 1;
slider.scrollLeft = scrollLeft - walk;
답변 1
<li><a href="//sir.kr/main/g5/">그누보드5</a>
코드 보시면 href 부분을 날리시거나 href="javascript:;" 정도로 수정하면 되실거세요.
아니면 li > a 에 대해 e.preventDefault(); 걸어줘도 되는데 위의 수정이 편하실거세요.
그럼 클릭했을때 페이지로 이동 못하는거 아닌가요?
