Forum Academy Marketplace Showcase Pricing Features

Slideable Menu Question

As I’m seeing in the demo, the Slideable menu will not squeeze the content on the page. Effectively, this will push the calendar off to the side leaving only one “active” workspace. Is that correct? Is there a way to squeeze a calendar made of native bubble elements when the menu comes out?

Hi @duke.severn,

You’re correct in that it won’t squeeze the content on the page. It’s gonna ‘push it’.
However, both the sections do remain active i.e. you can click any button / text etc. on either at any point in time


I am trying this method with the javascript and it works perfectly for group elements…however it doesn’t function properly when the elements are floating groups

Have you had any issues with this?

My main reason for attempting the Z-index approach is because there is a bug with the “send to back” and “bring to front” commands and my page isn’t functioning properly after the bug affected it.


I have tested this an I was incorrect to state it doesn’t work with floating groups…it does work

HOWEVER, it will not work if you were to use the “replace” function in the editor on a element that was originally a group and you “replace” it with a floating group.

This seems to be the problem I am having with my floating group side menu being unresponsive to the “send to back” and “bring to front” commands that led me to test the Z-index method.

So, for anybody who is ever having issues like this, that elements are not responding to the “bring to front” and “send to back” commands, which I suppose are pre-built bubble z-index placements, it might be because you have used the “replace” feature and this somehow causes the problem.

Hello… I do have RG within the Slideable menu. and i want when user click on any current text of this RG to hide the menu (and then I have workflow navigate to same page with page parameters). I have added ID attribute to text and i have included it in plugin set up Triggers element id. but it doesn’t close the menu. However i am able to do the same for Static elements. any suggestions or ideas how do I achieve that?

I Solved the issue… I had a group within that group there was an RG.
So what i did grouped the group again so i am having now group inside another group and then RG.

I have put ID attribute on the MAIN group to close the menu and it worked.

@gaurav This is a great plugin but I do have some questions about some odd behavior that I hope you can assist with.

In the gif below I load a page with the slideable menu and clicking the bars icon in a on-screen menu the sliding menu works, going in and out properly. I’ve used a repeating group to present selections to change the data. Selecting different menu options works fine as long as the menu remains exposed…the first time. After that, closing the menu it really acts weird.

After I close the menu, I cannot properly open it again. You can see below that it opens, then gets hidden right away. On this page there is only a header, no other elements or groups on the page.

The only workflow that is done is the setting of states when one of the buttons is pressed. The states are changed then the page is reloaded. The “Page is loaded” workflow also just sets states if not already set and ends with the Setup Slideable Menu action.

One other odd thing is that using a secondary on-screen “menu” duplicating everytihng in the sliding meu so I can make selections without having to open the menu every time, I can also change the data. What’s odd is that after closing the menu the first time, the slideable menu only open on every-other selection from the on-screen menu. In other words, if I select a single new menu option from the on-screen menu, the sliding menu does not open at all, if I change the selection a second time, it will open, only to be hidden again. It only briefly opens when it’s an even selection from the RG. Odd number of selections it won’t open, after an even number of selections it opens briefly.

Could you also explain the use of the Tolerance setting?

I had the exact same question about Tolerance + Touch. Thanks to the cdn, I found out this plugin is based on Slideout.js.
The Github documentation says :

  • [options.tolerance] (Number) - The number of px needed for the menu can be opened completely, otherwise it closes. Default: 70.
  • [options.touch] (Boolean) - Set this option to false to disable Slideout touch events. Default: true.

My understanding is the following: when you drag (touch activated) the content, tolerance is the number of pixels needed to trigger the SlideIn or SlideOut action.

Two cases :

  1. Menu is already closed :
    => The menu opens if dragged more than 70px (and stay closed if dragged less than 70px)
  2. Menu is already opened :
    => opposite behaviour

Illustration from github :

Thank for the reference to github, that was helpful.

For anyone else that might be looking at this issue (@gaurav ) I have determined that the issue I’m having is related to the use of a “Go to page” action after selecting an item from the menu and the “Go to page” action is to the same page you’re on. For whatever reason, the “Go to page” being the same page you’re on causes the slider to fail.

Maybe this causes the slider to be set up a second time confusing it?

Any help would be appreciated.

Just discovered this thread after having exactly the same issue and scratching my head, but suspecting it was linked to Go to Page.

Did you get anywhere with this @chris.charette241 ? Did you just switch away from URL params for your nav?

I have messaged Gaurav today with a video of the behaviour.