jQuery小试之菜单栏
这次要写的是一对菜单栏:一横一纵,有淡入淡出的效果,同时随着鼠标点击指示图标修改。
前台界面:
HTML代码:
[html]
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link href="css/menu.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<ul>
<li class="main">
<a href="#">文件</a>
<ul>
<li><a href="#">新建</a></li>
<li><a href="#">保存</a></li>
</ul>
</li>
<li class="main"><a href="#">编辑</a>
<ul>
<li><a href="#">复制</a></li>
<li><a href="#">查找</a></li>
</ul>
</li>
<li class="main"><a href="#">帮助</a>
<ul>
<li><a href="#">检查更新</a></li>
<li><a href="#">版本说明</a></li>
</ul>
</li>
</ul>
</div>
<p>分割线————————分割线</p>
<div>
<ul>
<li class="hmain">
<a href="#">文件</a>
<ul>
<li><a href="#">新建</a></li>
<li><a href="#">保存</a></li>
</ul>
</li>
<li class="hmain"><a href="#">编辑</a>
<ul>
<li><a href="#">复制</a></li>
<li><a href="#">查找</a></li>
</ul>
</li>
<li class="hmain"><a href="#">帮助</a>
<ul>
<li><a href="#">检查更新</a></li>
<li><a href="#">版本说明</a></li>
</ul>
</li>
</ul>
</div&g
补充:web前端 , JavaScript ,