复制代码
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
- <script type="text/javascript">
- $(function(){
-
- $("ul.two").hide();
- $("li.four").hover(function(){ $(".two" this).SlideDown();},
- function(){
- $(".two" this).slideUp();
- });
- });
-
- </script>
- <title>无标题文档</title>
- <style type="text/css">
- * {
- margin:0px;
- padding:0px;
- }
- #nav{ margin:20px;}
- ul {
- list-style-type:none;
- }
- .one{
- float:left;
- }
- a{ display:block;width:70px;height:30px; border:1px solid gray; text-align:center; line-height:30px; margin-left:5px;}
- </style>
- </head>
- <body>
- <div id="nav">
- <ul>
- <li class="one"><a href="">首页</a></li>
- <li class="one four"><a href="">龙隐</a>
- <ul class="two">
- <li><a href="">aaaa</a></li>
- <li><a href="">bbbb</a></li>
- <li><a href="">cccc</a></li>
- </ul>
- </li>
- <li class="one"><a href="">网易</a></li>
- <li class="one"><a href="">新浪</a></li>
- </ul>
- </div>
- </body>
- </html>
|
作者: 231798270
发布时间: 2009-05-24
$(".two" this)少了个逗号
$(".two", this)
作者: keakon
发布时间: 2009-05-24
菜单还是滑不出来
作者: 231798270
发布时间: 2009-05-24
SlideDown写成大写了
slideDown
作者: keakon
发布时间: 2009-05-24
谈出来了错位了如图
作者: 231798270
发布时间: 2009-05-24
你先学下css比较好…
你这样写,文档流是连续的,当然会被撑开
要用relative和absolute来定位,这样菜单项才能脱离文档流
此外最重要的是,看不出你有想做好它的意思,什么东西都是丢上来,就叫别人解决,完全没有自己考虑过
作者: keakon
发布时间: 2009-05-24
这么说还没有HOVER方便
作者: 231798270
发布时间: 2009-05-24