Topcoat Side Menu on swipe

2.2k Views Asked by At

So I'm working on a phonegap app using topcoat and implemented a fly out menu as seen here. I'm using this script to open/close the menu

$(function () {

    var slideMenuButton = document.getElementById('slide-menu-button');
    slideMenuButton.onclick = function (e) {
        var cl = document.body.classList;
        if (cl.contains('left-nav')) {
            cl.remove('left-nav');
        } else {
            cl.add('left-nav');
        }
    };

});

Now everything is working fine but what I want to add on is the ability to swipe to close the panel and to open it as well. I've seen touch library for jquery that seem to offer a solution (such as TouchSwipe) but I want to try to get this as close as possible to a 1:1 touch movement interaction.

Anyone have an idea on what direction I should go in to get this going or have any ideas? Any help is appreciated.

1

There are 1 best solutions below

0
On BEST ANSWER

Found this and with some renaming of classes, I got a touch slide out menu that works how I want. Its called Bamboo.js

Here's a demo of it