菜单效果


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 相关文章推荐
jQuery 技巧大全(新手入门篇)
May 12 Javascript
Jquery 获取指定标签的对象及属性的设置与移除
May 29 Javascript
NODE.JS加密模块CRYPTO常用方法介绍
Jun 05 Javascript
常用jQuery选择器总结
Jul 11 Javascript
jQuery中[attribute=value]选择器用法实例
Dec 31 Javascript
JavaScript中定义函数的三种方法
Mar 12 Javascript
json+jQuery实现的无限级树形菜单效果代码
Aug 27 Javascript
javascript基于原型链的继承及call和apply函数用法分析
Dec 15 Javascript
vue父组件向子组件传递多个数据的实例
Mar 01 Javascript
JavaScript封闭函数及常用内置对象示例
May 13 Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
Sep 20 Javascript
微信小程序实现录制、试听、上传音频功能(带波形图)
Feb 27 Javascript
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遍历二维数组的代码
2011/04/22 PHP
UCenter 批量添加用户的php代码
2012/07/17 PHP
PHP垃圾回收机制引用计数器概念分析
2013/06/24 PHP
php旋转图片90度的方法
2013/11/07 PHP
PHP模板引擎Smarty中变量的使用方法示例
2016/04/11 PHP
使用ltrace工具跟踪PHP库函数调用的方法
2016/04/25 PHP
JavaScript 学习点滴记录
2009/04/24 Javascript
使用Grunt.js管理你项目的应用说明
2013/04/24 Javascript
推荐 21 款优秀的高性能 Node.js 开发框架
2014/08/18 Javascript
JavaScript中遍历对象的property的3种方法介绍
2014/12/30 Javascript
JS实现在网页中弹出一个输入框的方法
2015/03/03 Javascript
javascript+html5实现绘制圆环的方法
2015/07/28 Javascript
动态创建按钮的JavaScript代码
2016/01/29 Javascript
微信小程序 PHP后端form表单提交实例详解
2017/01/12 Javascript
jQuery阻止移动端遮罩层后页面滚动
2017/03/15 Javascript
详解angularjs利用ui-route异步加载组件
2017/05/21 Javascript
jQuery实现表格的增、删、改操作示例
2019/01/27 jQuery
vue实现后台管理权限系统及顶栏三级菜单显示功能
2019/06/19 Javascript
小程序实现悬浮搜索框
2019/07/12 Javascript
在vue中使用vuex,修改state的值示例
2019/11/08 Javascript
[02:28]DOTA2亚洲邀请赛附加赛 RECAP赛事回顾
2015/01/29 DOTA
[00:33]2018DOTA2亚洲邀请赛TNC出场
2018/04/04 DOTA
对Python的zip函数妙用,旋转矩阵详解
2018/12/13 Python
python 生成器和迭代器的原理解析
2019/10/12 Python
Python基于paramunittest模块实现excl参数化
2020/04/26 Python
python和node.js生成当前时间戳的示例
2020/09/29 Python
Windows环境下Python3.6.8 importError: DLLload failed:找不到指定的模块
2020/11/01 Python
python中封包建立过程实例
2021/02/18 Python
python爬虫scrapy框架之增量式爬虫的示例代码
2021/02/26 Python
中国跨境电商:Tomtop
2017/03/16 全球购物
简历的自我评价
2014/02/03 职场文书
保险公司早会主持词
2014/03/22 职场文书
数学备课组工作总结
2015/08/12 职场文书
《西门豹》教学反思
2016/02/23 职场文书
HTML+JS实现在线朗读器
2022/02/15 Javascript
Java 多线程并发FutureTask
2022/06/28 Java/Android