Sorry, the InVision Help Center does not support Internet Explorer. Please download Microsoft Edge or another modern browser.


InVision ambassador ambassador
Lara Kocab

Mobile navigation appears on scroll up

So I am currently making a mobile prototype and wanted to have an in-page secondary nav bar appear as so:

On scroll down, the menu immediately appears

On scroll up, the menu immediately disappears

Something similar to this:

https://redvinestudio.com/demos/how-to-make-your-navigation-appear-on-scroll-with-jquery/

 

Any help with this is greatly appreciated!

 

- L

This post is associated with a known feature request: [[problemTicketSubject]]. Let our Product team know that you’re interested in this feature.

Sign in to add your vote

Thanks for taking the time to share your feedback about making our product better. We’ve let our Product team know that you’re interested in this feature so they can factor that into their product strategy.

comments

sort by


Shaina Torgerson
InVision ambassador Shaina Torgerson, InVision Employee , ambassador
Comment actions Permalink

Hi Lara,

Unfortunately, this is not a feature we currently have in play. Right now, any fixed header you set is the fixed header you get at all scroll positions.

The good news is that we are currently tracking interest for the feature for adding the ability to vary the fixed header that displays, based upon scroll position. I will open a ticket on your behalf so that Support can add your vote to this feature.

If anybody else would like to add their vote for this feature, please contact Support here and voice your opinion!

Thanks,

Shaina

2

ecmh
InVision ambassador ecmh , ambassador
Comment actions Permalink

Hey, Lara!

I did what you want to do. It's tricky but works well.

Here how to do that:

  1. Make two screens. The first is static view, the second is for scroll view
  2. In a build mode create link rectangle on the whole screen except header
  3. Set gesture for that link to swipe up, transition is instant, link to the second screen
  4. On a second screen create link rectangle on the top part right under the fixed header
  5. And set parameters: link to first screen, gesture is swipe down, transition is instant
  6. Play and setup

Good luck!

1

Shaina Torgerson
InVision ambassador Shaina Torgerson, InVision Employee , ambassador
Comment actions Permalink

Hi "ecmh",

Thanks so much for posting this helpful reply! We're glad that you have found a workaround for the issue she was facing.

If you would also like to put in your vote for this feature, be sure to use the link above to notify our Support team.

Have a wonderful day,

Shaina

0

join the conversation

to comment, sign up or sign in.