Transparent Top Bar Until Scrolling

http://www.yogaforevery.one/

I would like the top bar to be transparent (and I will make the logo and menu items white). Then, after scrolling past the header image, I’d like the menu to appear at 80% opacity, and the logo and menu items to return to #6d347a.

Example of something similar: http://patriciagomezyoga.com/

Can you help?

Hello there,

You can set amount of opacity from the options, and regarding sticky header, you can only apply white background after scroll with custom css code below:

header#masthead {
    position: static;
}

.sticky-wrapper.is-sticky .top-bar {
    background-color: #fff;
    opacity: 1;
}

There is no option to trigger sticky header at some time, and also you cannot style menu and logo, sorry :frowning:

It seems that you are referring to some commercial theme, and Moesia simply does not contain such options. Achieving this will require custom coding, and you should contact some 3rd party if you are not familiar with programming. You can try with Codeable for example.

All the Best!