I'm trying to drag a carousel of images linked with href to a separate page.
this is the code I found it works
let mouseDown = false;let startX, scrollLeft;const slider = document.querySelector('.carousel');const startDragging = (e) => { mouseDown = true; startX = e.pageX - slider.offsetLeft; scrollLeft = slider.scrollLeft;}const stopDragging = (e) => { mouseDown = false;}const move = (e) => { e.preventDefault(); if(!mouseDown) { return; } const x = e.pageX - slider.offsetLeft; const scroll = x - startX; slider.scrollLeft = scrollLeft - scroll;}// Add the event listenersslider.addEventListener('mousemove', move, false);slider.addEventListener('mousedown', startDragging, false);slider.addEventListener('mouseup', stopDragging, false);slider.addEventListener('mouseleave', stopDragging, false);
but I have an issue:
when I release the drag, the page fires the link. How do I prevent that?
thanks