Menu Colors (hover, current item, etc.)

resolved (11 posts) (2 voices)

  1. johnnyp14
    Member

    I went through about a dozen different similar posts and added various code to my custom CSS files, but none seemed to change menu colors.
    I am using a websafe font. I'd like to be able to change:
    -the color for current parent pages (if in a child page)
    -the background hover color for submenu items
    -the text color for hovered items

    Any suggestions?
    Thanks in advance!

    Posted 4 years ago #
  2. Elliott
    Support

    Hello johnnyp14,

    Add this to your custom CSS,

    .current_page_parent a span { color: red !important; }
    .sub-menu li:hover { background: red !important; }
    .jqueryslidemenu a:hover { color: red !important; }
    Posted 4 years ago #
  3. johnnyp14
    Member

    Thanks for your reply. I'm still getting some weird results.
    The red background only appears when I hover over the exact pixels that are NOT the text/link, but are still within that link's box.

    Edit: fixed one issue and removed it from this post

    Posted 4 years ago #
  4. Elliott
    Support

    Send us a link.

    Posted 4 years ago #
  5. johnnyp14
    Member

    http://rivervalleycf.com

    Posted 4 years ago #
  6. Elliott
    Support

    Try this,

    .jqueryslidemenu a:hover span { color: red !important; }

    Posted 4 years ago #
  7. johnnyp14
    Member

    Still nothing that I can see. Does it have something to do with the fancy hover-fade affect for links? If so, is there a way to disable that affect only for the menu? It looks cool on the buttons and other stuff :)

    Posted 4 years ago #
  8. Elliott
    Support

    It's changing on my end. Clear your browser cache.

    Posted 4 years ago #
  9. johnnyp14
    Member

    I tried it on 2 computers and even in private mode w/ no caching and still got the same result. It flashes red for a second and then returns to white when hovering above the text links, very similar to how it changes when hovering over a button.

    Attachments

    1. hoverlink.jpg (13.6 KB, 1 downloads) 4 years old
    2. hoverborder.jpg (12.9 KB, 0 downloads) 4 years old
    Posted 4 years ago #
  10. Elliott
    Support

    I see. You'll want to do this then,

    .jqueryslidemenu .sub-menu li:hover, .jqueryslidemenu .sub-menu li a:hover {
        background: red !important;
        color: white !important;
    }
    Posted 4 years ago #
  11. johnnyp14
    Member

    That seems to have done the trick. I'll play with colors to see what lines change what exactly.
    Thank you!

    Posted 4 years ago #

Reply

You must log in to post.

Construct WordPress Theme
Construct wordpress theme
Myriad WordPress Theme
Myriad wordpress theme
Method WordPress Theme
Method wordpress theme
Fusion WordPress Theme
Fusion wordpress theme
Elegance WordPress Theme
Elegance wordpress theme
Echelon WordPress Theme
Echelon wordpress theme
Dejavu WordPress Theme
Dejavu wordpress theme
Modular WordPress Theme
Modular wordpress theme