0

Hola estoy teniendo un problema con un sitio Pagina web a la hora de verlo en mobile en un dispositivo con android. El problema surge cuando quiero scrollerar o deslizarme con el dedo y no me deja ver las siguientes paginas. En Ios funciona todo bien, pero el problema es con android y con chrome. el javascript que use es el siguiente:

var esperando = false;
  function irSeccion(elem) {
          if (esperando){
            return
          }
          if (location.pathname.replace(/^\//,'') == elem.pathname.replace(/^\//,'') && location.hostname == elem.hostname) {
              var target = $(elem.hash);
              target = target.length ? target : $('[name=' + elem.hash.slice(1) +']');
              if (target.length) {                   
                  $('html, body').animate({
                      scrollTop: target.offset().top,
                    },{
                      start:function(){esperando = true},
                      complete:function(){ esperando = false},
                      duration:350
                    });
                  return false;
              }
          }
  }
  var $document = $(document),
      $sections = $('section'),
      $bullets = $('#Bullets > li'),
      $activeBullet = $bullets.first();

      /** EVENTOS DEL MOUSE */
      function onMouseWheel(dir) {
          if (esperando){return}
          if( dir > 0 ) {
           $document.trigger('scrollDown');
          } else {
           $document.trigger('scrollUp');
         }
        }

        // firefox
        window.addEventListener('DOMMouseScroll', function(e){
          onMouseWheel(e.detail);
        });
        // google
        $document.on('mousewheel', function(e){
          onMouseWheel(e.originalEvent.deltaY);
        })
        .on('scrollDown', function(){
            if (esperando){return}

            var $next = $activeBullet.next();
          
            if(!$next.length) {return}
            $activeBullet = !!$next.length ? $next : $bullets.first();
          
            $activeBullet.trigger('active');
          
        })
        .on('scrollUp', function(){

            var $prev = $activeBullet.prev();
          
            if(!$prev.length) {return}
            $activeBullet = !!$prev.length ? $prev : $bullets.last();
          
            $activeBullet.trigger('active');

        });

        /** EVENTOS DE LOS BULLETS */

        $bullets.on('active', function(e){
            
            $bullets.removeClass('active');
          
            var $li = $(this).addClass('active');
          
            $sections.filter('.' + $li.attr('data-section')).trigger('active');
            irSeccion($(this).find('a').get(0));

        })
        $bullets.find('> a').on('click', function(){

            console.log('click')
            $(this).parent().trigger('active');
          
        });

        /** EVENTOS DE LAS SECCIONES */
        $sections.on('active', function(){
          
            $sections.removeClass('active');
          
            var $section = $(this).addClass('active');  

            /* Alguna acción más */

        });

        $activeBullet.trigger('active');

        $('.awesome-tooltip').tooltip({
              placement: 'left'
          });  
          $('body').scrollspy({ 
              target: '#mainnav', 
              offset: 002
          });  
          
          $('a[href*=#]:not([href=#])').click(function() {irSeccion(this)});
          
          /*CAROUSEL DE INDEX*/
  /*Carousel index */ 
       (function () {
        var sliderImages = document.querySelectorAll('.image'),
            arrowLeft = document.querySelector('#left-arrow'),
            arrowRight = document.querySelector('#right-arrow'),
            currentImg = 0;

        function initSlider() {
            resetSlider();

            sliderImages[0].style.display = 'block';
        }

        function resetSlider() {
            for (var i = 0; i < sliderImages.length; i++) {
                sliderImages[i].style.display = 'none';
            }
        }

        function toLeft() {
            resetSlider();
            sliderImages[currentImg - 1].style.display = 'block';
            currentImg--;
        }

        function toRight() {
            resetSlider();
            sliderImages[currentImg + 1].style.display = 'block';
            currentImg++;
        }
         function trigger(element,type){
            var event;
            if (document.createEvent) {
                event = document.createEvent("HTMLEvents");
                event.initEvent(type, true, true);
              } else {
                event = document.createEventObject();
                event.eventType = type;
              }
              event.eventName = type;
              if (document.createEvent) {
                element.dispatchEvent(event);
              } else {
                element.fireEvent("on" + event.eventType, event);
              }
        }

        //Simula un click en la flecha de la derecha
        trigger(arrowRight,'click');

        //Hace movimiento automatico cada 3 sg
        setInterval(function(){trigger(arrowRight,'click');},3000);
        arrowLeft.addEventListener('click', function () {
            if (currentImg === 0) {
                currentImg = sliderImages.length;
            }

            toLeft();
        });

        arrowRight.addEventListener('click', function () {
            if (currentImg === sliderImages.length - 1) {
                currentImg = -1;
            }

            toRight();
        });

        initSlider();
    })();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

lo que quise hacer es bloquear los paginadores que están en comienzo del sitio para que en la versión mobile se pueda desplazar sencillamente si apretar cada punto.

2
  • No es una respuesta al problema que estás teniendo, pero no sería una solución más sencilla haber usado una maquetación responsiva y haber ocultado los botones que no quieres que se usen con un simple display:none; en su lugar?
    – frikinside
    el 30 oct. 2017 a las 15:32
  • Claro! si de cualquier manera es una maqueta responsive, el problema me lo esta generando calculo el js que no me esta permitiendo avanzar hacia las otras paginas, no se si tuviste la oportunidad de poder chequear el sitio en dispositivo en android y ver lo que sucede.
    – MarianoF
    el 30 oct. 2017 a las 15:48

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.