I have a CSS menu that I am trying to get to work all the way. Right now the hover works fine.

Here is the markup:

/* IMAGE ROLLOVERS */

a.home-button {
width: 127px;
height: 44px;
background: url(images/home-button.png);
}

a.home-button:hover, #navigation a:focus {
width: 127px;
height: 44px;
background: url(images/home-button-hover.png);
}

When someone clicks on the link and is taken to the new page I want the home-button-hover.png to replace home-button.

The images are tabs, hover-button.png is blue and home-button-hover.png is white. If I have the hover stay when the link is clicked it will show the visitor what page they are on, since the link image will be white.

As you can see I tried to make this happen by applying a:focus to the hover css but that didn't work.

p.s. #navigation is the div that the menu is in.

So how do I do this? (make hover stay when clicked)

p.s.s. I have tried making a:active the hover image but it only lasts while it is clicked then when the new page comes up the link goes back to normal.

The easiest way is to define a class for the 'selected' tab and add that to code, like this:

a.selected{background: url(images/home-button-hover.png);

Then in your html just do this: <a class="selected" href=.......">home</a>

Originally Posted by LadynRed

The easiest way is to define a class for the 'selected' tab and add that to code, like this:

a.selected{background: url(images/home-button-hover.png);

Then in your html just do this: <a class="selected" href=.......">home</a>

Thanks for your reply,

The only thing is that I am running off of wordpress so that won't work.
Wordpress is dynamic so that is going to be a little problem.

It's still possible in Wordpress, though you will need to know a bit of PHP:

http://wordpress.org/support/topic/140559

It involves using Wordpress' in-built functions 'in_category' and 'is_category'.

Thanks for that it looks like exactly what I need. The only thing is I need this to work for pages not categories. Since I have an about and contact page these are the only menu images that are going to change. How can I change the php line to work for categories?