人生从来没有真正的绝境。无论遭受多少艰辛,无论经历多少苦难,只要一个人的心中还怀着一粒信念的种子,那么总有一天,他就能走出困境,让生命重新开花结果。
简单的一个树形菜单,具体内容如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>树形菜单</title>
<style>
body {
font: 12px/20px 宋体;
}
img {
vertical-align: center;
border: none;
}
a {
text-decoration: none;
color: #000;
}
li {
list-style: none;
}
</style>
<script>
function onclickfclose(id) {
var ul = document.getElementById(id);
var objv = ul.style.display;
if (objv == 'none') {
ul.style.display = 'block'
} else {
ul.style.display = 'none';
}
}
</script>
</head>
<body>
<b><img src="images/fold.gif" alt="">树形菜单</b>
<ul>
<a rel="nofollow noopener noreferrer" href="javascript:onclickfclose('art')"><img src="images/fclose.gif" alt="">文学艺术</a>
</ul>
<ul id="art" style="display: none;">
<li><img src="images/doc.gif" alt="">著名小说</li>
<li><img src="images/doc.gif" alt="">著名小说</li>
<li><img src="images/doc.gif" alt="">著名小说</li>
<li><img src="images/doc.gif" alt="">著名小说</li>
</ul>
<ul>
<a rel="nofollow noopener noreferrer" href="javascript:onclickfclose('fangc')"><img src="images/fclose.gif" alt="">房产论坛</a>
</ul>
<ul id="fangc" style="display: none;>
<li><img src=" images/doc.gif" alt="">房产推销</li>
<li><img src="images/doc.gif" alt="">房产推销</li>
<li><img src="images/doc.gif" alt="">房产推销</li>
<li><img src="images/doc.gif" alt="">房产推销</li>
</ul>
<ul>
<a rel="nofollow noopener noreferrer" href="javascript:onclickfclose('tuhua')"><img src="images/fclose.gif" alt="">提图专区</a>
</ul>
<ul id="tuhua" style="display: none;>
<li><img src=" images
/doc.gif" alt="">风景图画</li>
<li><img src="images/doc.gif" alt="">风景图画</li>
<li><img src="images/doc.gif" alt="">风景图画</li>
<li><img src="images/doc.gif" alt="">风景图画</li>
</ul>
<ul>
<a rel="nofollow noopener noreferrer" href="javascript:onclickfclose('bagua')"><img src="images/fclose.gif" alt="">娱乐八卦</a>
</ul>
<ul id="bagua" style="display: none;>
<li><img src=" images
/doc.gif" alt="">明星采访</li>
<li><img src="images/doc.gif" alt="">明星采访</li>
<li><img src="images/doc.gif" alt="">明星采访</li>
<li><img src="images/doc.gif" alt="">明星采访</li>
</ul>
</body>
</html>
到此这篇关于JavaScript实现简单的树形菜单效果就介绍到这了。困住一个人的,从来不是年龄和身份,而是格局和观念。每个年纪,都是恰到好处的自己。趁未老,多!花开不是为了花落,是为了绽放!生命不是为了活着,是为了活得精彩!更多相关JavaScript实现简单的树形菜单效果内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!




