Streaming live at 10am (PST)

Custom Side-nav Responsive help


#1

Hi all,

im building a custom sidenav bar, the desktop and ipad are working how i want them to.

on mobile i want to hide the content , similar to how the “Navigation” available in the webflow library

http://test-amazing-project.webflow.io/


Here is my site Read-Only:
https://preview.webflow.com/preview/test-amazing-project?preview=f6528e84e2f556b9ceff4d54585b117e

can anyone help?


#2

As it’s a Symbol you just want to drag it into a div block first. And then you can set the divblock to not be visible on mobile

Hope that helps


#3

thanks russell,

with your help, i am able to hide the div block.

i was hoping , to be able to open and close the navigation , like a hamburger menu would.

do you have any suggestions to tackle that?

thank you again


#4

Glad I could be of help.

I’d recommend having a play with interactions 2, and get yourself familiar with all the different options. Webflow has excellent short tutorial videos on these & they are fun to practice/learn

You could start with this one (and instead of ‘Show lyrics’ it would be your hamburger icon): https://www.youtube.com/watch?v=fAWt2SOwmBI

And then specifically for a sidebar menu like that - I think an Out Quint 0.5s transition could be nice for the movement


#5

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