求大神告知这该怎么解？

<div id="topmenu">

<div class="topmenu">
<ul>
<li class="fir"><a href="../"><%=Dh_siteName%></a></li>
<li class="ulist" onmouseover="shlist(1)" id="ul1"><a href="javascript:void(0)">主题社区</a><div class="sulist" id="us1" style="width:180px;" onmouseout="chlist(1)">
<a href="#">南康时事开讲</a><a href="#">房地产</a>
<a href="#">亲子乐园</a>
<a href="#">吃货大队</a>
<a href="#">游山玩水</a>
<a href="#">女人帮</a>
<a href="#">影音风</a>
<a href="#">摄影</a>
<a href="#">宠物</a>
<a href="#">竞技</a>
<a href="#">闲的来聊</a>
</div>
</li>
<li class="ulist" onmouseover="shlist(2)" id="ul2"><a href="javascript:void(0)">生活服务</a><div class="sulist" id="us2" style="width:140px;" onmouseout="chlist(2)">
<a href="#">租房</a>
<a href="#">二手房</a>
<a href="#">亲子乐园</a>
<a href="#">找工作</a>
<a href="#">分类信息</a>
</div></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
<script type="text/javascript">
jQuery(document).ready(function() {
var topmenu = jQuery("#topmenu");
var topmenu_top = topmenu.offset().top;
reset_topmenu_top(topmenu, topmenu_top);
jQuery(window).scroll(function() {
reset_topmenu_top(topmenu, topmenu_top);
});
});
function reset_topmenu_top(topmenu, topmenu_top) {
var document_scroll_top = jQuery(document).scrollTop();
if (document_scroll_top > topmenu_top) {
topmenu.css('top', document_scroll_top);
}
if (document_scroll_top <= topmenu_top) {
topmenu.css('top', topmenu_top);
}
}
</script>

这里是一个随滚动条滚动置顶的导航
里面嵌入了类似滑动门的效果
CSS如下：

#topmenu{
top:0;
position:absolute;
background:#e9e1cb;
width:100%;
margin:0 auto;
clear:both;
overflow:hidden;
z-index:11;
left:0;
color:#958b6d;
font-size:14px;
border-bottom:1px solid #dad2bd;
}
.topmenu{
width:990px;
margin:0 auto;
}
.topmenu ul{
margin:0;
padding:0;
}
.topmenu ul li{
float:left;
text-align:center;
width:90px;
list-style:none;
line-height:30px;
height:30px;
}
.topmenu ul li.fir{
border-right:1px solid #dad2bd;
}
.topmenu a{
color:#958b6d;
text-decoration:none;
}
.topmenu a:hover{
text-decoration:underline;
}
.topmenu ul li.ulist{
display:block;
background:url(x.png) no-repeat 99% 50%;
}
.topmenu ul li.xlist{
background:#FFFFFF url(s.png) no-repeat 99% 50% ;
}
.sulist{
display:none;
left:0;
top:0;
position:absolute;
border-left:1px solid #dad2bd;
border-bottom:1px solid #dad2bd;
border-right:1px solid #dad2bd;
overflow:hidden;
background:#FFFFFF;
z-index:12;
}
.sulist a{
float:left;
display:block;
padding:3px 5px;
text-align:center;
font-size:12px;
margin:3px 5px;
}
.sulist a:hover{
background:#F1F1F1;
text-decoration:none;
}

JS文件如下：
function shlist(v)
{
for(var i=1;i<=10;i++)
{
if(i==v)
{
$("#ul"+i).attr("class","xlist");
var txt=$("#ul"+i).offset();
txtop=txt.top;
txleft=txt.left;
$("#us"+i).css({top:txtop+30,left:txleft-1});
$("#us"+i).show(0);
}
else
{
$("#ul"+i).attr("class","ulist");
$("#us"+i).hide(0);
}
}
}
function chlist(v)
{
$("#ul"+v).attr("class","ulist");
$("#us"+v).hide(0);
}

现在就出现了 鼠标移到主题社区或生活服务的时候 里面的子菜单不会显示出来
我把css里面的#topmenu{
top:0;
position:absolute;
background:#e9e1cb;
width:100%;
margin:0 auto;
clear:both;
overflow:hidden;
z-index:11;
left:0;
color:#958b6d;
font-size:14px;
border-bottom:1px solid #dad2bd;
}
position:absolute; 属性删掉之后 就可以正常了 但是那个导航就不会跟随滚动条置顶了
求大神告知 这该怎么办呀 谢谢