Почему не работает Swipe у Hammer.js?

Question

[ForSureN1]

Добрый день. У меня есть 2 блока, которые по свайпу, должны добавляться классы, которые в свою очередь будут создавать эффект "переворачивания" их, я решил использовать Hammer.js , так как у них есть как раз таки событие Swipe, я подвесил событие на свои 2 изображения, которые будут отвечать за свайп, но ничего не происходит, вот код

window.addEventListener('load', () => {
    let monitor = document.querySelector('.js-monitor')
    let phone = document.querySelector('.phone')
    let swipeMonitor = document.querySelector('.portfolio__monitor')
    let swipePhone = document.querySelector('.portfolio__phone')
    var managerOne = new Hammer.Manager(monitor);
    var managerTwo = new Hammer.Manager(phone);
    var Swipe = new Hammer.Swipe();
    managerOne.add(Swipe);
    managerTwo.add(Swipe);
    managerOne.on('swipe', swapPhone)
    managerTwo.on('swipe', swapMonitor)

    function swapPhone() {
        swipeMonitor.classList.add('rotate')
        swipePhone.classList.add('rotate')
    }

    function swapMonitor() {
        swipeMonitor.classList.remove('rotate')
        swipePhone.classList.remove('rotate')
    }
});

в Html через инспектор добавились какие то атрибуты, думаю это говорит о том что я все правильно подключил.
Заранее спасибо.

P.S. использовал пример из github https://codepen.io/choskim/pen/rGZqxa

Answer 1

[citizen55]

Добавляете один и тот же объект Swipe в два менеджера. Сделайте два свайпа, для каждого свой. И посмотрите что бы у вас сверху над целевыми, никаких других блоков не оказалось. Ну и как бы не стоит им (хаммером)
злоупотреблять, он требует достаточно ресурса. Можно обойтись и одним экземпляром свайпа.