Issue
I am wondering if it's possible to format only the most recently clicked link so that I can use it to show which page the user is on? My code currently looks like this: e- loa
.topbar a:link {color:#999}
.topbar a:visited {color:#999;}
.topbar a:hover { color:#666;}
.topbar a:active {color:#CCC;}
Ideally I'd like the active link to stay active when the page it's linking to loads so that the link is a lighter colour to show users which page they're on, but obviously this isn't possible. I'd love any suggestions for a better way of doing it too, no doubt there are loads.
Solution
There is no work around with CSS. You need to define in the markup what link is active. For example:
<nav class="topbar">
<a href="1.html" class="active"></li>
<a href="2.html"></li>
<a href="3.html"></li>
</nav>
You have to do this in the markup itself and then create a style such as this:
.topbar a.active {color:#red;}
You could also accomplish the class on that link by using a bit of javascript. This could find out the page you are on and add the class to that specific link element.
The :active selector only defines the style for the moment you have pressed on the link. It's kind of like a Button Pressed Down style. It's nice to give user feedback that a link was actually clicked and gives a nice touch. But it will not highlight the link that has been recently clicked.
Answered By - JNP Web Developer
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.