我有一个菜单,我想用不同颜色的文本或底部边框显示当前页面。
我知道如何使用不同的 html 文件来执行此操作,但是,我正在处理的当前网站位于单个文件 index.html 上。当我点击菜单时,它会向下滚动到特定的选项卡。
有谁知道在单个文件中设置菜单样式的方法吗?
HTML:
<div id="menu">
<ul class="nav">
<li><a href="#section1" class="a">aaa</a></li>
<li><a href="#section2" class="b">bbb</a></li>
<li><a href="#section3" class="c">ccc</a></li>
<li><a href="#section4" class="d">ddd</a></li>
<li><a href="#section5" class="e">eee</a></li>
</ul>
</div>
CSS:
#menu ul li .a:hover {
color: #6D6D6D;
border-bottom: 2px solid #fcd017;
}
目前我可以在悬停时更改它,但在这种情况下我想在我留在#section1 中时更改它。
最佳答案
<script type="text/javascript">
var backcolor = [
"#aaaaaa",
"#bbbbbb",
"#cccccc",
];
function changeBGcolor(whichcolor)
{
if (document.body)
{
document.getElementById('menu').style.backgroundcolor = '(' + backImage[whichcolor] + ')';
}
}
</script>
<div id="menu">
<ul class="nav">
<li><a href="javascript:changeBGcolor(1)" class="a">aaa</a></li>
<li><a href="javascript:changeBGcolor(2)" class="b">bbb</a></li>
<li><a href="javascript:changeBGcolor(3)" class="c">ccc</a></li>
<li><a href="javascript:changeBGcolor(4)" class="d">ddd</a></li>
<li><a href="javascript:changeBGcolor(5)" class="e">eee</a></li>
</ul>
</div>
有时试试这个会有用
关于html - 菜单 CSS 在单个 html 文件中显示当前页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17189069/