js二级导航

最新推荐文章于 2021-09-21 15:04:51 发布

chubi5506

最新推荐文章于 2021-09-21 15:04:51 发布

阅读量200

点赞数

文章标签： xhtml

原文链接：https://my.oschina.net/u/3806608/blog/1834593

版权

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>无标题文档</title>

#daohang{

width:800px;

height:200px;

border:black solid 1px;

background-color:#e1e1e1;

background-repeat: repeat-x;

margin:20px auto;

}

#nav{

height:50px;

line-height:50px;

width:780px;

text-align:center;

background-color:blue;

padding-left: 20px;

}

#nav li{

float:left;

font-size:18px;

color:#fff;

list-style:none;

width:80px;

line-height:50px;

margin-left: 10px;

}

#nav li:hover{

background-color:#eee;

color:black;

}

.subnav{

width:700px;

height:50px;

background-color: #e1e1e1;

}

.subnav li{

width:80px;

float:left;

list-style:none;

color:black;

line-height:40px;

text-align:center;

height:40px;

font-size:16px;

margin-left: 10px;

}

.subnav li a{

text-decoration:none;

color:black;

}

</style>

window.οnlοad=function(){

var navs=document.getElementsByClassName("subnav");

for(var i=0;i<navs.length;i++){

navs[i].style.display="none";

}

function showMenu(nav){

var navs = document.getElementsByClassName("subnav");

for(var i = 0;i < navs.length;i++){

if(navs[i].id == nav){

navs[i].style.display = "inline";

}else{

navs[i].style.display = "none";

}

</script>

</head>

<body>

</ul>

<ul>

</ul>

</div>

<ul>

</ul>

</div>

<ul>

<li ><a href="#">第三个菜单</a></li>

</ul>

</div>

<ul>

<li ><a href="#">第四个菜单</a></li>

</ul>

</div>

</body>

</html>

转载于:https://my.oschina.net/u/3806608/blog/1834593

chubi5506

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js二级导航

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="ht...
复制链接

扫一扫

js二级导航

“相关推荐”对你有帮助么？