Streaming live at 10am (PST)

Scroll problems with a fixed sidebar on mobile devices


#1

Greetings Webflow community.
You've helped me before and I need your help once again :smile:

I'm designing a website for my client and I'm experimenting with a contact-slide-in-sidebar.

The sidebar is triggered by either pressing the "Kontakt" menu item or pressing the fixed envelope icon at the right-hand side. The problem arises on iPad and mobile devices, since the sidebar is fixed and I can't get it to be scrollable.
If it's not scrollable it bugs on mobile devices and they can't even close down the sidebar again, since the X-button is at the bottom.

What do I do to make it scrollable? - Choosing Overflow: Scroll; doesn't work.

Bonus question:
Since the sidebar has two triggers and they have an action on mouse click 1 and 2, how do I coordinate those, so that they don't bug if I open the sidebar with "button 1" and close it with "button 2"? What happens is that if I do that, I'll experiencing having to press the button twice to make it go back to "mouse click 1"-action.
Does it make sense? Sorry for my english :stuck_out_tongue:

I really hope you can and will help me ^_^

  • Oliver

Here is my public share link: LINK
(how to access public share link)


Left scroll menu not scrolling
#2

Hi there,

I've had this same issue. I ended up just making my menu shorter on mobile so I never found a fix but here is a threads that might help.

I know someone found a fix but I can't find it @PixelGeek was it you?


#3

Hello guys, @Curting and @DFink.

"Secret" is that overflow:scroll will appear only if object has height, which is smaller than content inside this object. So, for make any fixed object scrollable, you will have to give it some height and overflow: scroll option. Then, if content is longer than this object height, there will be scrolling available.

Hope it helps.

Cheers,
Anna


#4

Ahh i see, so you can use 100vh as well right?


#5

Yes, but if you have to deal with menu you have to count navbar height too if it is just regular menu.
As you can see in that post, that you quoted, we had to reduce menu height.


#6

Gotcha, If the menu goes over the nav and takes up the whole height it should be good right?


#7

Yes, should work. :slightly_smiling:


#8

Thanks for the help, guys!
I got it to work. :smile:
Have a nice day!


#9

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