Different colors for hover and current state of menus
Is it possible to code different colors for the hover state and the current state on a menu?
|
yes it is, this has been asked and answered - do a forum search
|
Did one and found a plethora of posts with unresolved answers and a lot of people confused and commenting on how complex it is.
Guess I don't need to know that badly. |
did you try the theme option ata->MENU 1 (Page Menu)->Background color: Hover?
|
That was what I did first thing.
But I want one background/type color for hover, and one background/type color for current, not the same for both. |
Quote:
|
?????? Uh, yeeees, I did. Obviously I'm missing something.
Maybe you can hint at what it was? |
ok, let me ask do you want three options
- default background color - active background color - hover background color so there would be three different color? |
Correct.
Unless I am wrong that the menu button showing what page you are on is called something other than "active." |
You can do it via the CSS inserts, but I'm going to see if I can mod the code so it will be a option.
|
That'd be great.
|
You might want to do this with CSS. I've a paying customer to do some work for now and won't get back to trying this for a few days at least.
check the stickies in the page menu bar and look for the 'cheat sheet' which you can use to help you create the correct CSS |
I'll give it a shot. Thanks for pointing me in the right direction.
|
Atahualpa 3.7.9
WP 3.4.2 http://www.nodesignstein.com --active state style not working in page menu-- I used JDs colored menu cheat sheet and have been working on styling the page menu via CSS inserts can't get the menu's active state style to work. Maybe that will help the previous post, tho my css is sloppy at best. I think i ordered the statements correctly, ie, Quote:
I have the following code in ATO>Add HTML/CSS Inserts /* ================================================ */ /* Page menu background */ /* ================================================ */ div#menu1 { margin-top:10px; margin-left:20px; } /* ================================================ */ /* Page Menu item's background */ /* ================================================ */ div#menu1 ul.rMenu { border: 0px solid #fffffe; background: #fffffe; height: 35px; } /* ================================================ */ /* Page Menu item */ /* ================================================ */ ul.rMenu li a:link, ul.rMenu li a:visited, ul.rMenu li { width: 90px !important; line-height: 2.3em !important; padding-right: 12px; margin:0px 6px 0px 6px; background: #dddddd; border: 1px solid #dddddd; text-align:center; } ul.rMenu li a:hover { background: #bbbbbb !important; border: 1px solid #bbbbbb !important; } ul.rMenu li a:active { background: #cccccc !important; border: 2px solid #cccccc !important; color: #787878 !important: } |
Cool - i solved it - kinda. Still having some issues but getting closer.
As per lmilesw's advice here: http://forum.bytesforall.com/showthread.php?t=18785 I just added: .current_page_item a { background: #cccccc !important; border: 1px solid #cccccc !important; color: #787878 !important: } |
All times are GMT -6. The time now is 03:00 AM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.