Tengo una barra de navegación que debería estar visible solo si el usuario se desplaza hacia arriba. A continuación se muestra el fragmento de código que funciona bien para el escritorio.

 $(window).scroll(function() { var scrollMovement = $(window).scrollTop(); if (topPosition < 200 ){ } else{ if(scrollMovement > topPosition) { $('#main-header').removeClass('show-header'); $('#main-header').addClass('hide-header'); } else { $('#main-header').removeClass('hide-header'); $('#main-header').addClass('show-header'); } } topPosition = scrollMovement; });

Lo anterior no funciona en móviles. Revisé varias preguntas similares en el foro y actualicé mis códigos, pero no tuve éxito. A continuación se muestra lo que he intentado hasta ahora.

 $(document.body).on('touchmove', onScroll); // for mobile $(window).on('scroll', onScroll); // callback function onScroll(){ var scrollMovement = $(window).scrollTop(); if (topPosition < 200 ){ } else{ if(scrollMovement > topPosition) { $('#main-header').removeClass('show-header'); $('#main-header').addClass('hide-header'); } else { $('#main-header').removeClass('hide-header'); $('#main-header').addClass('show-header'); } } topPosition = scrollMovement; };

¿Puedo saber qué parte no estoy haciendo correctamente?