If link is selected, turn opacity down for rest of links
I have a list of links, and as the title says I want to lower the opacity
of all the links except the selected one. So if All is selected,
Links1,2,3 should dim. If Link1 is selected, links All,Link2,3 should dim.
<nav class="primary">
<ul>
<li><a href="#" class="selected">All</a></li>
<li><a href="#">Link1</a></li>
<li><a href="#">Link2</a></li>
<li><a href="#">Link3</a></li>
</ul>
</nav>
css
nav.primary ul li a.selected {
color:#e2e2e2;
border-bottom: 1px solid #004672;
}
This is what I had in mind, although it doesn't work since it's incorrect:
nav.primary ul li a.selected > nav.primary li a {
opacity:0.5;
}
No comments:
Post a Comment