Transparent menu background sticky

Resolved sethmillscannon
(@sethmillscannon)

5 years ago
Hi Support Team!

I’m trying to get the following behavior in Meteorite:
1. On page load (no scrolling has happened yet) the sticky menu should be transparent with the header image or slider showing through
2. When scrolling down, the sticky menu should reduce in size vertically (this is working as expected) and the menu background should change to an opaque color that is set in “Menu Background Sticky”
What’s happening now:
1. On page load (no scrolling has happened yet) the sticky menu is transparent with the header image or slider showing through
2. When scrolling down, the sticky menu should reduce in size vertically (this is working as expected) and the menu background STAYS transparent; the menu background does not change to match the color set in “Menu Background Sticky”
Before Scrolling:
https://refresh.restoreoregon.org/support-images/ro-customize-header-navigation-before-scroll.png

After Scrolling:
https://refresh.restoreoregon.org/support-images/ro-customize-header-navigation-after-scroll.png

Color Settings for Sticky Menu:
https://refresh.restoreoregon.org/support-images/ro-customize-colors-header.png

The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

Thread Starter sethmillscannon
(@sethmillscannon)

5 years ago

For reference, I’m trying to get the same behavior as shown on the Agency example page here:

https://demo.terra-themes.com/meteorite-agency/
Theme Author terrathemes
(@terrathemes)

5 years ago
Hi,

I currently cannot find out why the color settings aren’t working for you (also your third screenshot link is broken), but you can mimic the behaviour with the following CSS:
```
@media only screen and (min-width: 1025px) {
  #masthead .nav-container.fixed {
    background-color: #ffffff !important;
  }
}
```
Please let me know whether this fixes your issue.
Thread Starter sethmillscannon
(@sethmillscannon)

5 years ago

Thank you! That helped!

I also found some mismatched characters (single quotes) in the Customizer > Fonts fields that needed to be corrected. Once I fixed that, the menu bar worked as expected!

Theme Author terrathemes
(@terrathemes)

5 years ago

Good to hear.
Was that quote error a mistake by the theme defaults?

Thread Starter sethmillscannon
(@sethmillscannon)

5 years ago

I don’t think so. There are a few people working in the Customizer at different times and experimenting with font changes, so it was probably just a copy-and-paste issue that caused the mismatched single quotes around the font family value in the form field.

Theme Author terrathemes
(@terrathemes)

5 years ago

Alright, thanks for the explanation. I’ll mark this topic as resolved then, feel free to ask for further assitance in a new thread.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Transparent menu background sticky’ is closed to new replies.

Tags