Archived topic

Hide main header on homepage on page load

3 replies · Started by James on September 25, 2018

Viewing posts 1–4 of 4

September 25, 2018 at 8:28 am #686008

I would like to hide the main header when the homepage loads so that only the hero image is visible, then when the user starts to scroll the sticky nav appears. I have the sticky nav appearing fine but all attempts using CSS to hide the main header hasn't worked yet as it affects the sticky nav as well and make this disappear also.

I'm working on a local server at the minute, so don't have a live link to show at the minute.

Any help if possible would be greatly appreciated.

Thanks
James

September 25, 2018 at 11:20 am #686159

Hi James,

Hard to tell without seeing the site unfortunately.

Is the navigation inside the header? If so removing the header will likely remove the header as well.

Would something like this help? https://docs.generatepress.com/article/show-sticky-navigation-only/

If not then can you duplicate the situation on a test server so we can see?

Thanks!

September 26, 2018 at 4:13 am #686629

Thanks Leo for your response, I have now uploaded the website to my demo server to give you a better idea.

https://www.insynccreative.co.uk/demo/harrods2018

When the website loads I would like the top header strip to be invisible/removed and then when the user starts scrolling the sticky nav will appear as it does now.

I tried the code you suggested but this didn't quite work.

Thanks

September 26, 2018 at 8:30 am #686914

Can you try fade or none for the sticky navigation transition?

Let me know :)

This archived topic is closed to new replies.

Start building better websites today.