[Resolved] Help with some Logo Magic

[Philipp]

Hi there.

In case of mobile scroll up I want the logo to minify and stay in the top left.

Just discovered that my code is not working.

could you please have a look?

Oh, and is there a better way to add custom css? using the customiser just adds everything to the html :/

Thanks a lot!!!

[David]

Hi there,

should the logo be remaining on screen when scrolling or should it only be displayed within the Sticky Mobile Header ?

[Philipp]

Thank you so much for the quick reply and helping me to communicate what I want.

yes the logo is supposed to remain on screen. this works quite well most of the time. but sometimes the menu is shown – but the logo is misplaced (under the menu)

hope this helps.

thank you!

[David]

Theres no easy way to transition between the logo being within the Mobile Header and not. You could change your CSs to this:

.navigation-branding img, 
.site-logo.mobile-header-logo.is_stuck img {
    position: absolute;
    height: 125px;
    top: 0;
    padding: 0;
}

The change being .site-logo.mobile-header-logo img becomes: .site-logo.mobile-header-logo.is_stuck img. This way it only absolutely positions the logo when the Mobile header is stuck ( albeit it off the screen on scroll down ).

[Philipp]

thank you! that did it!!

feels much better

[David]

Glad to be of help

[Author]

Posts