<style type="text/css">
ul{
font-size:12px
list-style:none
margin:0px
padding:0px
}
li{
padding:7px
}
a{
color:#FFF
text-decoration:none
}
a:hover{
color:#000
}
#menu{
float:left
text-align:center
width:70px
height:295px
padding-top:5px
margin-top:80PX
display:none
background-image:url(%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.gif)
}
</style>
<body>
<span id="box">
<img src="网页设计/1.gif" width="30" height="80" id="flag"/>
<div id="menu">
<ul>
<li><a href="#">学校地址</a></li>
<li><a href="#">学校热线</a></li>
<li><a href="#">学生登录</a></li>
</ul>
</div>
</span>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("#box").hover(function(){
$("menu").show(300)//显示菜单
},function(){
$("#menu").hide(300)//隐藏菜单
})
})
</script>
替换一下就可以
.menu ul li a.hide, .menu ul li a:visited.hide {display:none}//将元素隐藏、不保留其物理空间.menu ul li a:hover {color:#fffbackground:#36f}//设置鼠标悬停时链接的字体颜色。背景颜色.menu ul li a:hover ul {display:blockposition:absolutetop:21pxleft:0width:105px}//鼠标悬停时显示隐藏的元素、绝对定位、上、左边的位置、设置宽度属性.menu ul li a:hover ul li a ul {visibility:hidden}设置ul元素隐藏、并且保留其物理空间.menu ul li a:hover ul li a:hover ul {visibility:visibleposition:absoluteleft:105pxtop:0color:#000}鼠标悬停时显示ul元素、并设置绝对定位字体颜色.menu ul li a:hover ul li a:hover ul.left {left:-105px}负边距定位、让其再往左边偏移105pxdisplay:none /*隐藏*/display: /*显示*/
<ul style="display:none">
<li>菜单</li>
<li>菜单</li>
</ul>