Cyber Week Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Navigation Menu Active Tab Gradient?

Home Forums Support Navigation Menu Active Tab Gradient?

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #145029
    Shane

    Hey Gang,

    I’ve been playing more with layout and possibilities for blog.southernstatesimaging.com and have run into some trouble setting the gradient of the navigation menu items in their ‘Active’ state.. I’d like the Active state of all of the navigation menu items to have the same gradient which successfully applies to the navigation menu items in their ‘Hover’ state.. I have been playing with Microthemer UI to help with precise CSS adjustments and for help dealing with Soliloquy sliders attributes.. I’ve tried many selectors but I can’t seem to identify the appropriate ‘Active state’ class/selector to apply the navigation menu to get the gradient to apply to active items.. Is there a big incompatibility problem with Microthemer and the generate Press theme I have overlooked?

    Thanks!

    #145049
    bdbrown

    Hi Shane. I believe the “current-menu-item” class will give you the active menu selection. If that selection happens to be in a submenu, the “current-menu-ancestor” class will give you the top level active item.

    #145060
    Shane

    Got the Main Nav menu items to go gradient when a submenu item is selected, but not when the main menu items themselves are created.. Current-Menu-Item doesn’t seem to have any effect.. Also noticed that the Veterinary and Blog menu items both behave differently as well.. I hadn’t made any deliberate adjustments to these specific buttons.. Ideas what’s causing these funny responses?

    #145083
    Tom
    Lead Developer
    Lead Developer

    Have you tried targeting the element with this selector?: .main-navigation .main-nav ul .current-menu-item > a

    #145267
    Shane

    Hmm, still no luck :-/ I’m not sure if you’re very familiar with Microthemer and I feel bad troubling you guys with support of it FOR GeneratePress theme.. I believe I am targeting the correct element, applying the gradient to that full selector seems to have no effect.. Can’t get the ‘blog’ button to change to the gray gradient at any time..

    #145327
    Tom
    Lead Developer
    Lead Developer

    Weird, so you’re using that plugin to add the CSS? I’ve never used it.

    What if you add !important to the end of your CSS?

    Like this:

    .selector {
       background: my-value !important;
    }
    #146377
    Shane

    This plugin seems to be adding the !important to most all the code snippets it generates.. I can give you temp admin access to the site if you think it will help you pinpoint why I still can’t seem to find the right selectors.. It’s a mess. Would like to get navigation functioning properly in active states, both when main menu items are selected/hovered over, and when sub menu items are being hovered over.. As of now the main menu changes back to flat gray again.. Also the ‘Veterinary’ tab seems unresponsive to any of the other selectors that make change, not sure why.. Is there any kind of key that describes specifically what element each navigation selector denotes a little more intelligibly?

    #146417
    Tom
    Lead Developer
    Lead Developer

    Honestly, if the plugin is adding !important to everything it generates, I suggest finding a different one. Using !important should only be used in certain cases, and rarely at that.

    Are you just trying to add background images to your navigation? Have you taken a look at our Backgrounds add-on?

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.