Swipelistener not working on menu

Question

I am using jqMobi, ( NOT jQuery Mobile ). I am trying to get a swipelistener to work on the menu. Basically I just want to 'swipe' the menu open or closed with a horizontal swiping motion. Here is my js:

$.ui.ready(function () {
    . . . . .
    $(window).swipeListener({
        vthreshold: 50,
        hthreshold: 70,
        callBack: function (dir) {                
            if (dir.right) {
                $.ui.toggleSideMenu(true);
            }
            if (dir.left) {
                $.ui.toggleSideMenu(false);
            }

        }
    });
 });

This works great except for when I 'swipe' on this red part here -->

If I swipe anywhere else, it works fine. I have also tried to use the document selector, that also didn't work. I tried to add another swipelistener to the #menu and #menu_scroller as well.

This is very difficult for me to debug as my device is IOS6 and the "Debug Console" has been removed, so I can't just add a ton of console logging. ( I don't have a Mac, so I can't hook up the Developer Menu )

My theory is that since there are ontouchstart and ontouchend listeners on the menu items that this is interfering with my swipelistener. Any suggestions?

Answer 1

The swipeListener is being deprecated. Instead, there are events dispatched by jqUi [swipe,swipeLeft,swipeRight,swipeUp,swipeDown] that you can bind. The listeners you have for ontouchstart/ontouchend could be killing the event from propegating up though (are they custom listeners?)

$.ui.ready(function(){
    $(document).bind("swipeLeft",function(){
         $.ui.toggleSideMenu(false);
    });
    $(document).bind("swipeRight",function(){
         $.ui.toggleSideMenu(true);
    });
}