Scrollable Menu

A modern website can include a large number of pages and, as a result, may have too many links in the navigation menu. Well, you can put them into the sub-navigation lists, but in this case, the submenus become too tall and may go over the screen border. To save screen space, you can make the submenus scrollable. It is an elegant solution that will save screen space and help a user focusing on the content.

This example shows a navigation bar with scrollable sub-navigation lists. The menu includes a complete list of countries from all over the world and has 250+ elements. All countries are split into three groups. Each group has a title (item in the main menu) with a scrollable submenu.

Customize Download Example

Sidebar Menu with Scrollable Sub-menus

If your site is based on a sidebar menu, a user has a more vertical screen space, but it is still not enough area, and a scrollable menu is required. No matter what orientation of your menu bar. The scrolling lists will play a key role in improving the service to your site visitors.

This example is similar to the previous one, with the difference that the menu is vertical.

How to Make a Scrollable Menu

To make the submenus scrollable, just set the maximum height in pixels. If the submenu height is greater than the specified limit height, then the submenu automatically becomes scrollable. Otherwise, the submenu is shown in its entirety without the scroll bar. To set the height limit of the sub-navigation menus, enter a value in the "Submenus height" field under the "Options" Tab and press the "Apply Changes" or "Refresh" button.

How to Make a Scrollable Menu

You may also be interested: Multilevel Dropdown

“I did a couple of days of research and found some useful info but nothing that was really what I needed. When I came upon your site and menu generator I was a bit skeptical considering what I had found previously. Once I read up on your process and your generator I started using it. I found it to be very helpful in what I needed. The menu generator worked flawlessly and gave me all the options that I needed and then some. It had actually surpassed my expectations! Thank you for the generator that you created. It was very helpful to me and I'm sure it is to many others as well.” - Tony Pronenko, Diverse By Design.