JS实现菜单收缩

最新推荐文章于 2023-09-14 08:50:39 发布

deerlu

最新推荐文章于 2023-09-14 08:50:39 发布

阅读量244

点赞数

分类专栏： javascript 文章标签： Flash JavaScript Ruby C C++ ViewUI

本文链接：https://blog.csdn.net/deerlu/article/details/83400443

版权

javascript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

JS实现菜单收缩


<html>
	<title>javascript MenuTest</title>
	<head>
		<script type="text/javascript" src ="Menu.js"></script>
	</head>
	<body>
		<table width="174">
			<tr>
				<td bgcolor="#99CCFF"><a href="javascript:showMenu(lay0)">language</a></td>
			</tr>
			<tr id="lay0" style="display:none;">
				<td>
					<table width="100%" border="0" cellspacing="0">
						<tr>
							<td width="20%"></td>
							<td width="80%"><a href="" target="_blank">JAVA</a></td> 
						</tr>
						<tr>
							<td width="20%"></td>
							<td width="80%"><a href="" target="_blank">Ruby</a></td> 
						</tr>	
						<tr>
							<td width="20%"></td>
							<td width="80%"><a href="" target="_blank">C</a></td> 
						</tr>						
					</table>
				</td>
			</tr>
			<tr>
				<td bgcolor="#99CCFF"><a href="javascript:showMenu(lay1)">Flash</a></td>
			</tr>
			<tr id="lay1" style="display:none;">
				<td>
					<table width="100%" border="0" cellspacing="0">
						<tr>
							<td width="20%"></td>
							<td width="80%"><a href="" target="_blank">FLASH - 1</a></td> 
						</tr>
						<tr>
							<td width="20%"></td>
							<td width="80%"><a href="" target="_blank">FLASH - 2</a></td> 
						</tr>	
						<tr>
							<td width="20%"></td>
							<td width="80%"><a href="" target="_blank">FLASH - 3</a></td> 
						</tr>		
					</table>
				</td>
			</tr>
		</table>
	</body>
</html>


function showMenu(strID){
    var i;
    for(i=0;i<2;i++){
        var lay;

        lay = eval('lay' + i);
        if (lay.style.display=="block" && lay != eval(strID)){
            lay.style.display = "none";
        }
    }

    if (strID.style.display=="none"){
        strID.style.display = "block"; 
    }else{
        strID.style.display = "none"; 
    }
}