菜单效果

 更新时间:2006年10月14日 00:00:00   作者:  
复制代码 代码如下:

<SCRIPT language=JavaScript>
<!--
 var layerTop=15;       //菜单顶边距
 var layerLeft=20;      //菜单左边距
 var layerWidth=160;    //菜单总宽
 var titleHeight=26;    //标题栏高度
 var contentHeight=150; //内容区高度
 var stepNo=10;         //移动步数,数值越大移动越慢

 var itemNo=0;runtimes=0;
 document.write('<span id=itemsLayer style="position:absolute;overflow:hidden;border:1px solid #183789;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('<img src="../images/guanli.gif"><br><b><font color="#ffffff"><a href="admin_index.asp" target=_top><font color="#ffffff">管理首页</font></a> | <a href="logout.asp" target="_top"><font color="#ffffff">退出</font></a></font></b>','<DIV STYLE="PADDING-LEFT:15px">☉ <a href="zhuangtai.asp" target="right">商铺状态设置</a><br>☉ <a href="admin_right.asp?action=modify" target="right">管理我的商品</a> | <a href="admin_right.asp?action=addclass" target="right">添加</a><BR>☉ <a href="admin_right.asp?action=glnews" target="right">管理我的新闻</a> | <a href="admin_right.asp?action=addnews" target="right">添加</a><BR>☉ <a href="admin_right.asp?action=fk" target="right">查看我的留言</a><br>☉ <a href="editdingdan.asp" target="right">网上订单</a><br>☉  <a href="quebook.asp" target="right">缺货提醒</a><br></DIV>');
 addItem('<b><font color="#ffffff">信息修改</font></b>','<DIV STYLE="PADDING-LEFT:15px">☉ <a href="admin_right.asp?action=fkfs" target="right">付款方式修改</a><BR>☉ <a href="admin_right.asp?action=ps" target="right">配送说明修改</a><BR>☉ <a href="admin_right.asp?action=shjintr" target="right">商家简介修改</a><BR>☉ <a href="admin_right.asp?action=gong" target="right">修改我的公告</a><br></DIV>');
 addItem('<b><font color="#ffffff">商家设置</font></b>','<DIV STYLE="PADDING-LEFT:15px">☉ <a href="admin_right.asp?action=myziliao" target="right">商家资料修改</a><br>☉ <a href="admin_right.asp?action=pass" target="right">商家密码修改</a><br>☉ <a href="admin_right.asp?action=url" target="right">商家二级域名</a><br>☉ <a href="admin_right.asp?action=logo" target="right">修改商家LOGO</a><br>☉ <a href="tjbb.asp" target="right">商品销售统计</a><br></DIV>');
 addItem('<b><font color="#ffffff">其他设置</font></b>','<DIV STYLE="PADDING-LEFT:15px">☉  <a href="shjclass.asp" target="right">商品分类管理</a><br>☉ <a href="tuangou/index.asp" target="right">团购订单管理</a><br>☉ <a href="banner.asp" target="right">首页banner管理</a><br></DIV>');

 addItem('<b><font color="#ffffff">商家认证</font></b>','<DIV STYLE="PADDING-LEFT:15px">☉ <a href="../help3.asp#2" target="right">营业执照认证</a><br>☉ <a href="../help3.asp#7" target="right">电话认证</a><br>☉ 钻石认证<br>☉ VIP认证<br></DIV>');
 addItem('<b><font color="#ffffff">帮助信息</font></b>','<DIV STYLE="PADDING-LEFT:15px">☉ <a href="../help2.asp#2" target="right">管理新闻帮助</a><br>☉ <a href="../help2.asp#7" target="right">信息修改帮助</a><br>☉ <a href="../help2.asp#6" target="right">缺货信息帮助</a><br>☉ <a href="../help2.asp" target="right">商家操作帮助</a><br></DIV>');
 addItem('<b><font color="#ffffff">版权信息</font></b>','<DIV STYLE="PADDING-LEFT:15px">版权所有<BR> &reg 东莞商城<BR>业务联系<BR>QQ:234252308<br>24小时客服<br>+0769-21252157<br><a href="mailto:web@vcidc.com ">web#vcidc.com </a></DIV>');
 document.write('</span>')
 document.all.itemsLayer.style.height=itemNo*titleHeight+contentHeight+38;

 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>

相关文章

  • 移动端效果之IndexList详解

    移动端效果之IndexList详解

    这篇文章主要为大家详细介绍了移动端效果之IndexList,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-10-10
  • 让JavaScript和其它资源并发下载的方法

    让JavaScript和其它资源并发下载的方法

    这篇文章主要介绍了让JavaScript和其它资源并发下载的方法,JavaScript并发下载主要目的在于解决JS加载会阻碍页面呈现的问题,需要的朋友可以参考下
    2014-10-10
  • javascript实现划词标记划词搜索功能修正版

    javascript实现划词标记划词搜索功能修正版

    javascript实现划词标记划词搜索功能修正版...
    2006-12-12
  • javascript常用的正则表达式实例

    javascript常用的正则表达式实例

    小编之前整理了不少JavaScript常用的正则表达式实例,都是自己用的,现在放出来给大家分享下。
    2014-05-05
  • js实现录音上传功能

    js实现录音上传功能

    这篇文章主要为大家详细介绍了js实现录音上传功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-11-11
  • 最全的JavaScript开发工具列表 总有一款适合你

    最全的JavaScript开发工具列表 总有一款适合你

    最全的JavaScript开发工具列表分享给你,总有一款适合你!
    2017-06-06
  • JavaScript防抖案例讲解

    JavaScript防抖案例讲解

    这篇文章主要介绍了JavaScript防抖案例讲解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
    2021-08-08
  • Javascript实现数组中的元素上下移动

    Javascript实现数组中的元素上下移动

    这篇文章主要给大家介绍了Javascript实现数组中的元素上下移动的相关资料,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。
    2017-04-04
  • JavaScript中if嵌套assert的方法详解

    JavaScript中if嵌套assert的方法详解

    在JavaScript中,通常我们不会直接使用`assert`这个词,因为JavaScript标准库中并没有直接提供`assert`函数,下面是一个详细的示例,展示如何在JavaScript中模拟`assert`函数,并在`if`语句中嵌套使用它来检查条件,需要的朋友可以参考下
    2024-09-09
  • js防抖-节流函数的基本实现和补充详解

    js防抖-节流函数的基本实现和补充详解

    这篇文章主要介绍了防抖-节流函数的基本实现和补充,文章从基础概念到手写对防抖-节流函数的实现进行讲解,内容详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2023-01-01

最新评论