Hero bar won't scroll

site URL: www.5x5advisory.com

I previously had a problem with my sticky-header sub-menus not showing up and was given this answer: https://theme.co/apex/forum/t/dropdown-submenu-not-visible/34292/2?u=lancesalyers

While this did fix the problem – the submenus are no longer hiding behind the other content – it has created a new problem I didn’t realize until just now. With the bar containing my inline navigation menu set to “Content Scrolling - Off” users can’t use their mouse to scroll down past the hero image to the rest of the page. The scroll bar on the rights side of the browser, the down arrow key and Page Down key all work, but the mouse wheel doesn’t.

Hi lancesalyers,

Your website is under construction and I could not see the actual navigation that you are talking about. If you want to follow up you will need to give us a way to access your website.

Having said that, I think I know what you are talking about. Please consider that you either can have the scrolling on and lose the dropdown functionality or vice versa. You can not have them both at the same time.

Also, you need to find a way on your design to represent all your items in different window sizes. For example, in mobile view, it is better that you do not use the Navigation Inline element and use other alternative elements.

Please read this article to know how to enable one for a specific browser window width.

Thank you.

Hi Christopher –

I’m not sure what you’re talking about at all. My site is most definitely not "under construction – it has been live and working for weeks. The URL I included in my original post is correct and works - I just verified it again.

Also, I am aware of the need to design for different screen sizes, and have used X’s screen size toggles to serve up both an inline menu and a collapsed menu based upon the screen resolution.

Here’s a screenshot of my header inspector view:

So, to clarify:

  1. In order to get my dropdown sub-menus to work correctly, I had to turn off “Content Scrolling” in the “Navigation Inline” bar (the link provided in my initial post opening this thread);

  2. Doing so disables the mouse scrolling function of the “Hero - Lg Screen” bar, meaning the user has to know to either use their down arrow or page down keys, or manually point and click on the browser scroll bar on the right side of the screen. Why is that? / How do I fix this?

Hi @lancesalyers,

I’m able to view your site now. I’m not sure what was there, but to clarify your question.

Yes, you’ll have to turn off content scrolling option to display the sub-menu. And your hero bar isn’t scrolling is because the Content Scrolling is on. Hence, it captures the scrolling event instead of passing it to windows to scroll it. Don’t set content scrolling on to either bar.

May I know why it needs the Content Scrolling option to be on? I don’t see any horizontal content that needs scrolling.

Thanks!

THANK YOU, RAD! That fixed it.

I don’t know why I didn’t realize that option was for h-scrolling. You are quite right: it is not needed at all. :slight_smile:

You’re most welcome!
We’re glad we were able to help you out.

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