<style>
*{margin:0padding:0}
body{font:16px/1.5 "\5FAE\8F6F\96C5\9ED1","\5B8B\4F53", sans-serif, Arial, Systembackground-color:#FFF}/*\9ED1\4F53黑体*/
li{list-style:none}
a{text-decoration:nonecolor:#000}
.nav{background:rgb(255,175,0)height:45pxline-height:45px}
.nav>li{float:leftwidth:90pxtext-align:center}
.subnav{display:nonebackground:rgb(45,45,45)}
.subnav li{text-align:leftcolor:#ffftext-indent:15px}
.subnav li a{color:#fff}
</style>
<ul class="nav">
<li><a href="" target="_blank">首页</a></li>
<li><a href="" target="_blank">活动</a></li>
<li>更多
<ul class="subnav">
<li><a href="" target="_blank">设计师</a></li>
<li><a href="" target="_blank">专题</a></li>
<li><a href="" target="_blank">主创网</a></li>
</ul>
</li>
</ul>
<script>
$(function() {
$(".nav>li").hover(function() {
$(this).find('.subnav').slideDown()
}, function() {
$(this).find('.subnav').slideUp()
})
})
</script>
把要展开的元素做成绝对定位的(position:absolute),它就脱离了文档流,不会影响到后面的其他元素。当然,用了绝对定位后,你的代码也要做相应的修改才行,这就你自己去摸索了。欢迎分享,转载请注明来源:内存溢出
评论列表(0条)