推荐一个很好用的后台管理菜单模板

        我们在开发WEB系统的时候，常常要涉及到后台管理，简洁有效的管理菜单就至关重要。这种菜单一般居左，而右边则是相应操作区。下面这段代码源自一个ASP做的网上图书城的后台管理系统，因为代码的掌握和使用比较简单，因此被我用作模板。在学习使用ASP.NET之后，我继续修改成用户控件使用，自觉还是挺方便的，因此介绍给大家。
       代码由一段CSS格式表和JavaScript组成，既可以做成asp的inc文件，也可以做成asp.net的ascx文件。

<style type="text/css">
.titleStyle{background-color:#6B8FC8;color:#000000;border-top:1px solid #FFFFFF;font-size:9pt;cursor:hand;}
.contentStyle{background-color:#E8F1FF;color:blue;font-size:9pt;}
a{color:black;}
td{FONT-SIZE: 12px;COLOR: #000000; FONT-FAMILY: verdana; line-height:14pt}
A:link,A:active,A:visited{TEXT-DECORATION:none ;Color:#000000}
A:hover{TEXT-DECORATION: underline;Color:#FF0000}
</style>
<script language="JavaScript">
<!--
 var layerTop=20;       //菜单顶边距
 var layerLeft=30;      //菜单左边距
 var layerWidth=100;    //菜单总宽
 var titleHeight=20;    //标题栏高度
 var contentHeight=110; //内容区高度
 var stepNo=10;         //移动步数，数值越大移动越慢

 var itemNo=0;runtimes=0;
 document.write('<span id=itemsLayer style="position:absolute;overflow:hidden;border:1px solid #6B8FC8;left:'+layerLeft+';top:'+layerTop+';width:'+layerWidth+';">');

 function addItem(itemTitle,itemContent){
   itemHTML='<div id=item'+itemNo+' itemIndex='+itemNo+' style="position:relative;left:0;top:'+(-contentHeight*itemNo)+';width:'+layerWidth+';"><table width=100% cellspacing="0" cellpadding="0">'+
       '<tr><td height='+titleHeight+' onclick=changeItem('+itemNo+') class="titleStyle" align=center>'+itemTitle+'</td></tr>'+
       '<tr><td height='+contentHeight+' class="contentStyle">'+itemContent+'</td></tr></table></div>';
   document.write(itemHTML);
   itemNo++;
 }
    //添加菜单标题和内容，可任意多项，注意格式：
 addItem('首选服务','<div align=center><a href=logout.asp target=_top><font color=red>注销登陆</font></a><br><a href=admin.asp target=right>查看使用帮助</a><br><a href=renpassword.asp target=right>修改登陆密码</a></div>');
 addItem('监控管理','<center><a href=addbook.asp target=right>添加新图书</a> <BR><a href=managebook.asp target=right>查看与修改</a><BR><a href=editdingdan.asp?zhuangtai=0 target=right>管理图书订单</a><BR><a href=managepinglun.asp?action=no target=right>管理图书评论</a></center>');
 addItem('权限管理','<center><a href=viewfk.asp target=right>查看意见反馈</a></center>');
 addItem('新闻管理','<center><a href=manageuser.asp target=right>管理网站用户</a> <BR><a href=manageadmin.asp target=right>管理后台用户</a></center>');
 addItem('栏目管理','<center><a href=anclass.asp target=right>图书大类管理</a> <BR><a href=nclass.asp target=right>图书小类管理</a> <BR><a href=moveclass.asp target=right>图书类别转移</a></center>');
 
 document.write('</span>')
 document.all.itemsLayer.style.height=itemNo*titleHeight+contentHeight;
 
 toItemIndex=itemNo-1;onItemIndex=itemNo-1;

 function changeItem(clickItemIndex){
   toItemIndex=clickItemIndex;
   if(toItemIndex-onItemIndex>0) moveUp(); else moveDown();
   runtimes++;
   if(runtimes>=stepNo){
     onItemIndex=toItemIndex;
     runtimes=0;}
   else
     setTimeout("changeItem(toItemIndex)",10);
 }

 function moveUp(){
   for(i=onItemIndex+1;i<=toItemIndex;i++)
     eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)-contentHeight/stepNo;');
 }

 function moveDown(){
   for(i=onItemIndex;i>toItemIndex;i--)
     eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)+contentHeight/stepNo;');
 }
 changeItem(0);
//-->
</script>

      此外，还可以在菜单中加入权限判断语句，起到真正的后台管理菜单的作用！如：

<%if session("flag")>1 then%>  addItem('信息管理','<center><a href=viewfk.asp target=right>查看意见反馈</a></center>');<%end if%>

      当然还有许多菜单用例可供选择，这里就不多说了。