菜单效果


Posted in Javascript onOctober 14, 2006
<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> ® 东莞商城<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>
Javascript 相关文章推荐
对象的类型:本地对象(1)
Dec 29 Javascript
事件模型在各浏览器中存在差异
Oct 20 Javascript
JQuery中form验证出错信息的查看方法
Oct 08 Javascript
JavaScript获取一个范围内日期的方法
Apr 24 Javascript
javascript制作幻灯片(360度全景图片)
Jul 28 Javascript
jquery+css3实现会动的小圆圈效果
Jan 27 Javascript
Node.js测试中的Mock文件系统详解
Nov 21 Javascript
详解基于Node.js的HTTP/2 Server实践
May 31 Javascript
node.js中事件触发器events的使用方法实例分析
Nov 23 Javascript
详解element-ui动态限定的日期范围选择器代码片段
Jul 03 Javascript
Vue数组响应式操作及高阶函数使用代码详解
Aug 01 Javascript
关于vue中如何监听数组变化
Apr 28 Vue.js
Using the TextRange Object
Oct 14 #Javascript
使用TextRange获取输入框中光标的位
Oct 14 #Javascript
JS代码格式化和语法着色V2
Oct 14 #Javascript
[原创]静态页面也可以实现预览 列表不同的显示方式
Oct 14 #Javascript
动态加载js文件 document.createElement
Oct 14 #Javascript
不错的asp中显示新闻的功能
Oct 13 #Javascript
简单JS代码压缩器
Oct 12 #Javascript
You might like
PHP函数utf8转gb2312编码
2006/12/21 PHP
PHP 采集程序中常用的函数
2009/12/09 PHP
php自动获取字符串编码函数mb_detect_encoding
2011/05/31 PHP
Codeigniter购物车类不能添加中文的解决方法
2014/11/29 PHP
PHP入门教程之图像处理技巧分析
2016/09/11 PHP
yii2使用gridView实现下拉列表筛选数据
2017/04/10 PHP
CMSPRESS 10行代码搞定 PHP无限级分类2
2018/03/30 PHP
PHP实现数组根据某个单元字段排序操作示例
2018/08/01 PHP
PHP基于mcript扩展实现对称加密功能示例
2019/02/21 PHP
thinkPHP+LayUI 流加载实现功能
2019/09/27 PHP
javascript dom 操作详解 js加强
2009/07/13 Javascript
JS实现商品倒计时实现代码
2013/05/03 Javascript
JavaScript生成GUID的多种算法小结
2013/08/18 Javascript
用js正确判断用户名cookie是否存在的方法
2014/01/28 Javascript
调试代码导致IE出错的避免方法
2014/04/04 Javascript
Javascript中3个需要注意的运算符
2015/04/02 Javascript
javascript数组常用方法汇总
2016/09/10 Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
2016/11/26 Javascript
discuz表情的JS提取方法分析
2017/03/22 Javascript
妙用Angularjs实现表格按指定列排序
2017/06/23 Javascript
node 使用 async 控制并发的方法
2018/05/07 Javascript
Vue 项目分环境打包的方法示例
2018/08/03 Javascript
JS大坑之19位数的Number型精度丢失问题详解
2019/04/22 Javascript
JS实现返回上一页并刷新页面的方法分析
2019/07/16 Javascript
vue框架制作购物车小球动画效果实例代码
2019/09/26 Javascript
Python基于scrapy采集数据时使用代理服务器的方法
2015/04/16 Python
玩转python爬虫之爬取糗事百科段子
2016/02/17 Python
Python更换pip源方法过程解析
2020/05/19 Python
如何查看python关键字
2021/01/17 Python
美国一家全面的在线零售鞋类公司:SHOEBACCA
2017/01/06 全球购物
保护动物倡议书
2014/04/15 职场文书
大学英语专业求职信
2014/06/21 职场文书
党员个人总结自评
2015/02/14 职场文书
2015年高校保卫处工作总结
2015/07/23 职场文书
浅谈golang package中init方法的多处定义及运行顺序问题
2021/05/06 Golang
【海涛七七解说】DCG第二周:DK VS 天禄
2022/04/01 DOTA