我想做一个菜单来过滤主页上的列表。
例如:
<div id="filters">
<a href="#" id="all">Все</a>
<a href="#" id="top40">Топ-40</a>
<a href="#" id="top20">Топ-20</a>
<a href="#" id="top10">Топ-10</a>
</div>
因此,问题在于我如何突出显示此菜单中的活动项目。
请帮助我,或者如果还有其他方法可以这样做,请显示。
感谢您的任何建议!
最佳答案
您如何定义“活动”?
如果您的意思是您当前要悬停的那个,可以通过
应用#filters a:hover
规则。
如果您的意思是当前选择的页面,则只能手动进行
通过将类别名称添加到“活动”链接,或设置ID /类别<body>
(这样,您可以根据
“当前页面)。
更新:这是一种使用JavaScript选择链接的方法。
<script type="text/javascript">
function select (x)
{
var a = document.getElementById ("filters").getElementsByClassName ("active");
for (var i = 0; i < a.length; ++i)
a[i].className = "";
x.className = "active";
}
</script>
<a href="#" id="link1" onClick="select(this)">Foo</a>
<a href="#" id="link2" onClick="select(this)">Baz</a>
<a href="#" id="link3" onClick="select(this)">Bar</a>