código de ejemplo: - https://jsfiddle.net/dy1vk40f/

Quiero hacer una función de carrusel de imágenes, implementé todo con dos botones: forward y backword para desplazarse de acuerdo con los botones. He usado scrollcontainer.style.transform = translate3d(-250px, 0px, 0px); para mover las imágenes hacia adelante y viceversa. Ahora quiero implementar una función en la que cuando se hace clic con el mouse en el contenedor y se arrastra hacia la izquierda o hacia la derecha, quiero volver a cambiar la propiedad de transformación. Pero estoy luchando para hacerlo correctamente.

Tengo este código, pero da un desplazamiento muy defectuoso y no creo que sea la forma correcta de hacerlo. ¿Hay algún otro, sería de gran ayuda si alguien puede ayudar

 let isDown = false; let startX; let scrollLeft; scrollcontainer.addEventListener('mousedown', (e) => { isDown = true; startX = e.pageX; console.log(startX); }); scrollcontainer.addEventListener('mouseleave', (e) => { isDown = false; }); scrollcontainer.addEventListener('mouseup', (e) => { isDown = false; }); scrollcontainer.addEventListener('mousemove', (e) => { if(!isDown) return; e.preventDefault(); const x = e.pageX; const walk = (x - startX) * 3; scrollcontainer.style.transform = `translate3d(${walk}px, 0px, 0px)`; console.log({walk, startX}); console.log('gg'); });```