Search code examples
javascriptcsscordovatopcoat

Hide opened drawer when clicking outside of the drawer


I am using the following code to toggle (show/hide) a drawer: http://outof.me/navigation-drawer-pattern-with-topcoat-css-library/

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

Works fine. Now, I would like the drawer to close whenever anything outside the drawer is clicked. Is there a recommended way how to do this?


Solution

  • The solution would be:

    $("body").on("click",function(e) {
        var cl = document.body.classList;
        if (cl.contains('left-nav')) {
            cl.remove('left-nav');
        }
    }
    

    (Works for me.)