Streaming live at 10am (PST)

Limit drop down menu height and add scroll bar


#1

Hi guys

I'm trying to add a drop down box to the main content area of my homepage so a user can select a page and click through to it.

There's going to be around 80 pages listed in this drop down menu item though, so I want to control the height, and force a scroll bar on desktop view so users can scroll through the full list, without the list just being huge and filling the height of their screen!

Has anyone done this or know how?

As always, thanks in advance!

(p.s. no public link because I've not actually started implementing this yet)


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


#3

@JamesLondesborough,

Do you want this to work in tablet/mobile views as well? Do you have an exact example to show us?

Thanks,
~B.


#4

Hi @itbrian40 thanks for replying, I'd be flexible about how it worked on other devices. On mobile it's not so much a problem the list filling the screen as you can scroll through nice and easy.

If you look at the 'City' drop down box at the top of http://www.accommodationforstudents.com/ for example, it's a long drop down but has a scroll bar to contain. I'd make mine look nicer though :wink:

Cheers!


#5

@JamesLondesborough,

This method is good in form submissions like your example, but as page navigation I'd have to recommend you look for another method. Perhaps break it down across the nav into categories (or some other taxonomy) rather than just have one drop down list full of 80 items... that's a lot of scrolling. IMHO, too much.

Edit: Link Removed

I didn't do anything with it for mobile.

~B.


#6

Thanks for taking a look @itbrian40

The link you posted doesn't work... would love to see what you managed to figure out though if you can get it to work?

I also have a demo of the site up and running. If you go to http://pad-group-studentpad.webflow.io you will see the drop downs at the top where I'm going to have the lists of 80 items (city names).

None of this is linked up to anything yet, so it's more just a visual.

Cheers


#7

Yes, I placed an edit in my prior post removing the link. You didn't respond for weeks, so I thought you figured it out. I won't get back to this anytime soon, but maybe someone else will be able to help you out. It looks like you're off to a great start with the new version.

Take care,
~B.


#8

Cheers @itbrian40 the webflow guys have weighed in and threw a couple of solutions over that seem to have got it pretty much to where I need it.

Thanks again for your help, and sorry I missed you the first time round :slight_smile:


#9