Hammer.js swipe does not working on rotated iframe

user_12817071 0
Viewed 155

I made an iframe on the page and rotated it by transform.

    body.rotate iframe {
        transform: rotate(90deg);
        transform-origin: top right;
        position: absolute;
        top: 100%;
        right: 0;
        height:100vw;
        min-width:100vh;
    }

and tried to add swipe event on the page in an iframe.

    var el = document.getElementById('swipe');
    Hammer(el).on('swipeleft', next);
    Hammer(el).on('swiperight', prev);
    Hammer(el).on('doubletap', preview);

When I doubletap on div#swipe in the rotated iframe, preview() is triggered. but swipeleft and swiperight doesn't work.

hammer.js iframe css html javascript
1 Answers

Please follow this guide.

var el = document.getElementById('swipe');
var mc = new Hammer(el);
mc.get('pan').set({ direction: Hammer.DIRECTION_ALL });
Hammer(el).on('swipeleft', next);
Hammer(el).on('swiperight', prev);
Hammer(el).on('doubletap', preview);
user_118887220
Related