I have strip of navigation tabs, which are marked up as a[/FONT] <ul> [FONT=“Georgia”]and styled to look like tabs with borders and all that.
In my stylesheet I have the pseudo-classes for[/FONT] :link , :visited , :hover , :active [FONT=“Georgia”]and all of those work fine.
But I’d like to have the browser highlight whichever link a viewer is currently on by having Javascript activate the already defined[/FONT] :active [FONT=“Georgia”]pseudo-class.
What’s the syntax for that? Is it even possible?
I’ve been googling for almost an hour and havn’t gotten anything.
I know there’s no :current pseudo-class. I’d like to artificially recycle what I defined for :active [FONT=“Georgia”]in my stylesheet to highlight what’s current.
Without having to use five lines of Javascript to set everything one style at a time, nor create a new class.
Sounds like you are getting active and current mixed up.
The :active pseudoclass is the style that applies while the mouse or enter key is depressed - it has nothing to do with which is the current page. There is no :current pseudo class unfortunately.
If the current one is supposed to be the one that relates to the current page, the advised way is to use a body identifier, so that you can then explicitly target that from the navigation itself.
You can then use the following CSS to set a current status to the appropriate one:
body#aboutus #navaboutus,
body#contactus #navcontactus {
/* current nav link style here */
}
This means that only on the contactus page, will the nav link for contactus have a different style, and likewise for other pages such as the aboutus page.