En mi página web, tengo opciones de navegación en la parte superior y luego, más abajo, en el medio de la ventana gráfica, hay otro div separado desplazable para el artículo. Cuando los visitantes comiencen a desplazarse en el artículo div (contenedor de arte), el método scrollintoview traerá el div al centro de la ventana gráfica. Lograr esto fue fácil en el escritorio pero no en el navegador móvil. Touchmove, el evento touchstart por sí solo no funcionó como se esperaba. Estaba tratando de detectar deslizar hacia arriba en el móvil y finalmente la detección de deslizar hacia arriba está funcionando y puedo hacer que algo sea visible y oculto usando deslizar hacia arriba y hacia abajo en el móvil, pero ¿por qué la función de desplazamiento hacia la vista no funciona ahora? Probé scrollto que funcionó pero scrollintoview no funciona. Por favor, ayúdenme a resolver esto, ¿cómo hacer que funcione y alguna otra idea para obtener el mismo resultado ...?
HTML
<div class="articles-container" id="art-container" ontouchstart="touchStart(event)" ontouchmove="touchMove(event)" ontouchend="touchEnd()">JAVASCRIPT
var startingX , startingY , movingX , movingY ; function touchStart(evt) { startingX = evt.touches[0].clientX ; startingY = evt.touches[0].clientY ; } function touchMove(evt) { movingX = evt.touches[0].clientX ; movingY = evt.touches[0].clientY ; } function touchEnd() { if(startingY+100 < movingY) { console.log('down'); document.getElementById("Ellipse_3").style.visibility = "visible"; document.getElementById("Ellipse_2").style.visibility = "hidden"; } else if(startingY-100 > movingY) { console.log('up'); // only scrollIntoView not working document.getElementById("art-container").scrollIntoView({ block: 'center', behavior: 'smooth' }); // style changing on swipe up is working fine document.getElementById("Ellipse_2").style.visibility = "visible"; document.getElementById("Ellipse_3").style.visibility = "hidden"; } }