Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Page & Category Menu Bars (http://forum.bytesforall.com/forumdisplay.php?f=10)
-   -   Different colors for hover and current state of menus (http://forum.bytesforall.com/showthread.php?t=18533)

tbaxter Oct 2, 2012 02:18 AM

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?

juggledad Oct 2, 2012 04:27 AM

yes it is, this has been asked and answered - do a forum search

tbaxter Oct 3, 2012 04:05 AM

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.

juggledad Oct 3, 2012 04:13 AM

did you try the theme option ata->MENU 1 (Page Menu)->Background color: Hover?

tbaxter Oct 3, 2012 05:31 AM

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.

juggledad Oct 3, 2012 06:10 AM

Quote:

But I want one background/type color for hover,
and one background/type color for current,
not the same for both.
did you look at the other options there?

tbaxter Oct 3, 2012 07:16 AM

?????? Uh, yeeees, I did. Obviously I'm missing something.

Maybe you can hint at what it was?

juggledad Oct 3, 2012 07:30 AM

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?

tbaxter Oct 3, 2012 08:00 AM

Correct.

Unless I am wrong that the menu button showing what page you are on is called something other than "active."

juggledad Oct 3, 2012 09:08 AM

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.

tbaxter Oct 3, 2012 12:40 PM

That'd be great.

juggledad Oct 3, 2012 12:56 PM

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

tbaxter Oct 3, 2012 01:02 PM

I'll give it a shot. Thanks for pointing me in the right direction.

davidsteinmusic Oct 28, 2012 03:12 AM

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:

Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!!

Note: a:active MUST come after a:hover in the CSS definition in order to be effective!!

Note: Pseudo-class names are not case-sensitive.
But there is a 2px border around the active state that is the color of the default state and as far as i can tell, i didn't put that in the css. I tried removing some / all of the !important and couldn't get it to be 1 solid cover for the active state. Any ideas? Thanks in advance.

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:
}

davidsteinmusic Oct 28, 2012 03:27 AM

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.