События Swipe в мобильном Safari периодически прерываются

Я пытаюсь настроить события прокрутки для сайта, над которым я работаю. По сути, когда кто-то проводит пальцем по контейнеру содержимого, его дочерние элементы div будут изменять содержимое в зависимости от страницы, на которой он находится. Фактический div «contentwrapper», к которому я прикрепляю прослушиватели swipe, не меняется.

Для некоторых анимаций у меня есть контейнер предыдущей и следующей страницы, в котором хранится содержимое. Я удалил функцию ajax, где я заполняю их для простоты.

Это работает при движении вперед, но при движении назад я, кажется, теряю поведение preventDefault, и вся страница перемещается с помощью моего пальца. Эта проблема возникает только периодически и исчезает при движении назад.

    // Slightly modified code by Dave Dunkin
    // http://rabblerule.blogspot.com/2009/08/detecting-swipe-in-webkit.html

    function addSwipeListener(el, listener)
    {
     var startX;
     var dx;
     var direction;

     function cancelTouch()
     {
      el.removeEventListener('touchmove', onTouchMove);
      el.removeEventListener('touchend', onTouchEnd);
      startX = null;
      startY = null;
      direction = null;
     }

     function onTouchMove(e)
     {
      if (e.touches.length > 1)
      {
       cancelTouch();
      }
      else
      {
       dx = e.touches[0].pageX - startX;
       var dy = e.touches[0].pageY - startY;
       if (direction == null)
       {
        direction = dx;
       }
       else if ((direction < 0 && dx > 0) || (direction > 0 && dx < 0) || Math.abs(dy) > 400)
       {
        cancelTouch();
       }
      }
     }

     function onTouchEnd(e)
     {
       cancelTouch();
      if (Math.abs(dx) > 30)
      {
        listener({ target: el, direction: dx > 0 ? 'right' : 'left' });
        dx = 0;
      }
     }

     function onTouchStart(e)
     {
        e.preventDefault();
        e.stopPropagation();
      if (e.touches.length == 1)
      {
       startX = e.touches[0].pageX;
       startY = e.touches[0].pageY;
       el.addEventListener('touchmove', onTouchMove, false);
       el.addEventListener('touchend', onTouchEnd, false);
      }
     }

     el.addEventListener('touchstart', onTouchStart, false);
    }

Добавить прослушиватель свайпов

     addSwipeListener(document.getElementById("contentwrapper"), function(e) {
          swipePageChange(e);
      });

       function swipePageChange(e) {
           if(e.direction == "left") {
               moveforward();
           }
           if(e.direction == "right") {
              movebackward();
           }
       }

События перемещения страницы

    function moveforward() {
            $("#previouspagecontainer").css("z-index","20");
            $("#newpagecontainer").css("z-index","40");

            $("#previouspage").html($("#circular").html())
            $("#newpagecontainer")[0].style.webkitAnimationName = 'flippageright';
            $("#newpagecontainer")[0].addEventListener('webkitAnimationEnd', function() {
                $("#currentpagecontainer").css("z-index","30");
                $("#newpagecontainer")[0].style.webkitAnimationName = '';
                $("#circular").html($("#nextpage").html());
            });
            return false;
        }

        function movebackward() {
                $("#previouspagecontainer").css("z-index","40");
                $("#currentpagecontainer").css("z-index","30");
                $("#newpagecontainer").css("z-index","20");
                $("#previouspagecontainer")[0].style.webkitAnimationName = 'flippageleft';
                $("#previouspagecontainer")[0].addEventListener('webkitAnimationEnd', function() {
                    $("#previouspagecontainer")[0].style.webkitAnimationName = '';
                    $("#circular").html($("#previouspage").html());
                });
             return false;
        }