# Can you open side menu with a swipe from left to right ? (Touchscreen)

**URL:** <https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119>\
**Category:** Dashboard\
**Created:** [7 July 2021 08:53 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119 "2021-07-07T08:53:39Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ithoh](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ithoh/32/40000_2.png) [@Ithoh](https://discourse.nodered.org/u/Ithoh)\
**Post date:** [7 July 2021 08:53 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/1 "2021-07-07T08:53:39Z")

</div>

Good morning / afternoon,

I'm using the dashboard on a touch screen, I would like to know if there's a simple way of opening the side menu with a swipe from left to right ? (I don't like the navigate between tabs with swipes)

I was going to try to do it with some **ui\_template** node and some javascript, but I'm not sure if there's already a custom event listener to listen to swipes (I guess there's some because you can swipe between tabs)

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [7 July 2021 18:26 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/2 "2021-07-07T18:26:30Z")

</div>

Hi - no - currently it is swipe between tabs - or not.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [7 July 2021 19:01 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/3 "2021-07-07T19:01:27Z")

</div>

You may try to play with this:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/e/be333590e15c2f06a550304bfeecb21e225ce61f.png)

And with ui\_template:

```auto
<script>
$("body").on("swipeleft",function( event ) {
    if($("md-sidenav").hasClass("md-locked-open")){
        $("md-sidenav").removeClass("md-locked-open")        
    }
})
$("body").on("swiperight",function( event ) {
    if($("md-sidenav").hasClass("md-locked-open") == false){
        $("md-sidenav").addClass("md-locked-open")
    }
})
</script>

```

The ui\_template probably must exist in all tabs ... and I can't give any guarantees 😃

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [7 July 2021 20:44 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/4 "2021-07-07T20:44:46Z")

</div>

Actually I was in there looking at fixing something else so have added it as an option for next release 😉  
Now pushed to master

---

<div class="post-metadata">

**Author:** ![Ithoh](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ithoh/32/40000_2.png) [@Ithoh](https://discourse.nodered.org/u/Ithoh)\
**Post date:** [8 July 2021 08:45 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/5 "2021-07-08T08:45:22Z")

</div>

Thank you @hotNipi for your answer, I'll try it out when I have time and I'll get back to you to let you know if it's working !

---

<div class="post-metadata">

**Author:** ![Ithoh](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ithoh/32/40000_2.png) [@Ithoh](https://discourse.nodered.org/u/Ithoh)\
**Post date:** [8 July 2021 09:47 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/6 "2021-07-08T09:47:20Z")

</div>

Ok so,

I did some testing on my side your solution works fine but I tweaked it a bit to fit my needs,

- I disabled the "Always show side menu" and went for "Click to show side menu", because it caused me some troubles, the groups would not re-arrange properly when closing the side nav
- I added to the script the part to remove the class so that when I change tab, the tab close automatically (I just copied and past the part where you remove the class but without the swipe event detection)

Would you know by any chance how to add the animation to the opening ? 😁

Thank you for your amazing solution by the way !

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [7 August 2021 09:48 UTC](https://discourse.nodered.org/t/can-you-open-side-menu-with-a-swipe-from-left-to-right-touchscreen/48119/7 "2021-08-07T09:48:00Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.