Actualmente estoy creando un control deslizante de imagen y baso mi código en lo siguiente: https://codepen.io/Snip3r/pen/GxybbN

 { const sliders = document.querySelectorAll(".c-template__slider"); for (let i = 0; i < sliders.length; ++i) { const slider = sliders[i]; const dots = slider.querySelector(".c-template__dots"); const sliderImgs = slider.querySelectorAll(".c-template__img"); let currImg = 0; let prevImg = sliderImgs.length - 1; let timeout; for (let i = 0; i < sliderImgs.length; ++i) { const dot = document.createElement("div"); dot.classList.add("dot"); dots.appendChild(dot); dot.addEventListener("click", dotClick.bind(null, i), false); } const allDots = dots.querySelectorAll(".dot"); allDots[0].classList.add("active-dot"); sliderImgs[0].style.left = "0"; function animateSlider(nextImg, right) { if (!nextImg) nextImg = currImg + 1 < sliderImgs.length ? currImg + 2 : 1; --nextImg; sliderImgs[prevImg].style.animationName = ""; if (!right) { sliderImgs[nextImg].style.animationName = "leftNext"; sliderImgs[currImg].style.animationName = "leftCurr"; } else { sliderImgs[nextImg].style.animationName = "rightNext"; sliderImgs[currImg].style.animationName = "rightCurr"; } prevImg = currImg; currImg = nextImg; currDot = allDots[currImg]; currDot.classList.add("active-dot"); prevDot = allDots[prevImg]; prevDot.classList.remove("active-dot"); } function dotClick(num) { if (num == currImg) return false; clearTimeout(timeout); if (num > currImg) animateSlider(num + 1); else animateSlider(num + 1, true); } } }

Este control deslizante tiene todo lo que necesito, excepto una cosa: deslizar la funcionalidad en dispositivos móviles entre cada imagen.

¿Alguien sabe de algún código JS adicional que pueda agregar que habilitará esta funcionalidad? Me han dicho que no puedo usar una biblioteca, solo Vanilla JS.

Supongo que es algo similar a agregar un detector de eventos táctil a cada uno y luego usar las funciones para nextImg, etc., pero nuevamente, no soy lo suficientemente competente en JS para entender, ¡así que me comunico!

Espero que alguien pueda ayudar. Gracias.

Nota: el código que he pegado aquí es mi propio código y es ligeramente diferente al código vinculado ya que eliminé el intervalo y agregué mis propias clases, pero el resto es igual.