landing page --> menu should hide by default, but appear when scrolling down

Hi Sven,

That website doesn't seem to be loading for me.

Can you check and let me know?

Thanks!

Hi Tom,
should be working... can you pls try again?
Sven

Hmm let's try this..

Set the "Sticky effect" to "Fade" or "Slide".

Then add this CSS:

.main-navigation {
    display: none;
}
.main-navigation.navigation-clone {
    display: block;
}

Nice site BTW!

Let me know :)

Nearly... the menu is hiding and by scrolling down it appears (with the set effect)... that's cool!

But now there appears a white block where the menu regularly was. Also a dot "." shows up on the left side!?

http://www.fudiggl.de/wp-content/uploads/hide_menu_error1.jpg

Any suggestions?

Hi Tom,

I actually discovered, that this way the menu not only disappears on my start page but on ANY (!) page/post... I had to adjust that, so it takes effect only where I want to have it...

page-id-nnn .main-navigation {
display: none;
}

.page-id-nnn .main-navigation.navigation-clone {
display: block;
}

(where nnn ist the page-/post-id)

Now I only need help with that dot and that blank area!

Hope, you have an idea!?

The dot seems to be coming from this custom CSS:

.my-transparent-section:before {
    position: absolute;
    content: ".";
    background-color: rgba(255, 255, 255, 0);
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
}

Where's the main image coming from? Is it uploaded as the section background?

Hi Tom,
no, it's manually set as background-image:

body.page-id-nnn {
background-image:url('http://www.fudiggl.de/wp-content/uploads/site_background_2016.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-clip:border-box;
background-position:0px 70px;
background-size: 1963px auto;
}

Concerning "the mysterious dot" :-)
I used your code snippet for transparent sections as mentioned in the support forum. Just out of curiosity: why did you use it in your code? Is there a deeper meaning?

I have deleted it in the code snippet, seems to me, there's no negative effect... so I'll leave it blank.

Now there's only one further thing: actually the menu is hiding and instead of the menu there's a blank white space on top of my start page. How to expand the background image so there's no white area at all?

I've seen it myself...!!! Somewhere in the positioning process I set "background-position:0px 70px;"

It's done!

Thank you for your support!

Best wishes,
Sven

Awesome, glad you found it :)

Hi Tom,

after months I recently encountered an error at https://fudiggl.de :
on the start page I hide the main menu. It's showed when scrolling down. Therefore I used your recommended css as written in this post.

Now recently the menu disappeared at all - and doesn't show when one scrolls..

Also on my mobile phone (chrome browser) the word "menu" and its common icon (three horizontal lines) are shown, but the don't work: one can tap on the word or the lines and that changes the color of the menu background, but no menu appears!

But: it works well within the customizer...

I don't know anymore, where to look and what to do... so I appreciate your help!

Best regards, Sven

Can you try this solution?
https://docs.generatepress.com/article/show-sticky-navigation-only/

Let me know :)

Now any menu is hidden... no menu at all!

Did you remove the CSS Tom provided previously?

Let me know :)

Yes I removed Tom's code and added the one, you mentioned: https://docs.generatepress.com/article/show-sticky-navigation-only/

then the menu disappeared (desktop and mobile)

now I've reset: deleted sticky and re-added Tom's css again... error persists!