2 Sticky Menus on the same page

Hello, I need to show 2 sticky menus on the same page.

The first one should appear when WindowSrollY > 70pix and the Second when > 500pix

I have no problem with the first one, but it’s impossible to show/hide the second one.

Can anyone help me with that?

Thank you very much :slight_smile:

My file as example: menu-test.rp (51.0 KB)

Murat

Hi!

The issue is that because you have all ELSE IFs, only one condition out of the four will execute. When the condition “scrollY >= 500” is true, the condition “scrollY >= 70” is ALSO true. And since the latter is the first condition in the list, it will be the only one that executes.

Instead test for the greater value first. I think the following will do what you are trying to do:

Hello, and thank you for your help :slight_smile:

Actually, I need to have both of the Menus on the page:

  • menu 1 need to be shown when scrollY>=70

  • menu 2 need to be shown when scrollY>=500 just under the Menu1

  • menu2 need to be hidden when scrollY<500

  • menu1 need to be hidden when scrollY<70

Here’s my file Test_file.rp (143.5 KB)

And what I can get: http://vzdkuv.axshare.com/#g=1&p=collection

As you can see, I’m not too far, but far from being perfect lol

Thank you again for your help,
Murat

Hi!

My script assumes both objects are on the page, and hides and shows both as you want them to.

[Edit] Attaching file: menu-test.rp (61.5 KB)

Hello josephxbrick :slight_smile:
Thank you very much for your help !

Well I used your file to make my 2 modifications : as you can see, I still can’t have the result I’m waiting for :frowning:

http://vzdkuv.axshare.com/home.html

If you have a minute you can check you file as I modified :
menu-test.rp (60.8 KB)

The second is still displayed and hidden only with the first menu … I’m totally lost :frowning:

Thanks again,
Murat

Edit on Thursday, Nov 2nd:
I have managed to make it work, I have cheated but, it works ^^ thank you for your help.

menu-test.rp (61.2 KB)
Here is the working RP file. The value of 500 was to high, i edited to 140 and it works. Now how to create that those Header 1, Header 2 are always shown, and are at different position. When i scroll, those headers replace the main header and become sticky till next header. How to create that?

Is this what you are looking for ? :slight_smile:

https://ddhqf7.axshare.com/#g=1&p=home

If yes, here the way I’d do it…

menu-test_mb.rp (63.6 KB)

Hi,

I’ve shared a method how to do that as “clean” as possible in Axure: How to prototype sticky navigations

Hope this may help you and others!