Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

Nav bg color affecting dropdown bg color

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Hello, I am trying to apply the default Navbar Link Hover Background Color to the Navbar Link Background Color so the transparent effect is always on each main menu items

When I add rgba(0,0,0,0.4) to the Navbar Link Background Color in the template manager, it looks fine, BUT also applies a grey background box to the dropdown/sub menu items, which I do not want

Is there a way to do this and keep the dropdown background all one color? Thanks

www.candleray.com/joomla_three_new/
  • joomjohnny5's Avatar
  • joomjohnny5
  • 3 Month Basic
  • 26 posts
  • Karma: 0
The administrator has disabled public write access.
I am not sure I fully follow your question:

Do you want to make the dropdown background the same as the navbar link background, that is a transparent black/grey like the background on the main menu items?

If so you need to look at the Dropdown Style section in the template admin, just below the navbar section.

To apply the same rgba(0,0,0,0.4) change:
Dropdown Background to 000000 - the hex code for black
Dropdown background opacity to 40% - the 0.4 part of the rgba.

Then save and compile.

You may then need to adjust some of the other value to make the links visible on the site.

If this does not give you the effect you want then post back with more details and one of the jb guys will help for sure.

Regards Ian
  • iafdesign's Avatar
  • iafdesign
  • LIfetime Developer - Big Bamboo
  • 393 posts
  • 153 Thanks
  • Karma: 58
The administrator has disabled public write access.
When scrolling down and sticky nav is applied, I lose the inactive text color in the dropdown (white)? It goes from white to dark, not sure which option this is.

Also, this looks good as you described, thank you. But I was trying to rid of the boxes in the dropdown that are around the menu items/links. It seems whatever color applied to "Navbar Link Background Color" also applies to a bounding box in the dropdown around the sub menu items? Can these be separated?

Thank you, let me know what you think!
www.candleray.com/joomla_three_new/
  • joomjohnny5's Avatar
  • joomjohnny5
  • 3 Month Basic
  • 26 posts
  • Karma: 0
The administrator has disabled public write access.
For the font colour try adding

#navwrap.fixed a, #navwrap.fixed span.zen-menu-heading {
color: #fff;
}
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
#navwrap.fixed #menu .zen-menu-child.cols-1 a {background:none;}

I'm not sure this will work with the content underneath but this line removes the inner dark background block

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers