非常不错的功能强大代码简单的管理菜单美化版


Posted in Javascript onJuly 09, 2008

太激动了...竟然还发现有备份文件
<script type="text/javascript">
window.onload=function(){
function $(id){return document.getElementById(id)}
var menu=$("topTags").getElementsByTagName("ul")[0];//顶部菜单容器
var tags=menu.getElementsByTagName("li");//顶部菜单
var ck=$("leftMenu").getElementsByTagName("ul")[0].getElementsByTagName("li");//左侧菜单
var j;
//点击左侧菜单增加新标签
for(i=0;i<ck.length;i++){
ck[i].onclick=function(){
$("welcome").style.display="none"//欢迎内容隐藏
clearMenu();
this.style.background='url(images/tabbg02.gif)'
//循环取得当前索引
for(j=0;j<8;j++){
if(this==ck[j]){
if($("p"+j)==null){
openNew(j,this.innerHTML);//设置标签显示文字
 }
clearStyle();
$("p"+j).style.background='url(images/tabbg1.gif)';
clearContent();
$("c"+j).style.display="block";
   }
 }
return false;
  }
 }
//增加或删除标签
function openNew(id,name){
var tagMenu=document.createElement("li");
tagMenu.id="p"+id;
tagMenu.innerHTML=name+"  "+"<img src='images/off.gif' style='vertical-align:middle'/>";
//标签点击事件
tagMenu.onclick=function(evt){
clearMenu();
ck[id].style.background='url(images/tabbg02.gif)'
clearStyle();
tagMenu.style.background='url(images/tabbg1.gif)';
clearContent();
$("c"+id).style.display="block";
}
//标签内关闭图片点击事件
tagMenu.getElementsByTagName("img")[0].onclick=function(evt){
evt=(evt)?evt:((window.event)?window.event:null);
if(evt.stopPropagation){evt.stopPropagation()} //取消opera和Safari冒泡行为;
this.parentNode.parentNode.removeChild(tagMenu);//删除当前标签
var color=tagMenu.style.backgroundColor;
//设置如果关闭一个标签时,让最后一个标签得到焦点
if(color=="#ffff00"||color=="yellow"){//区别浏览器对颜色解释
if(tags.length-1>=0){
clearStyle();
tags[tags.length-1].style.background='url(images/tabbg1.gif)';
clearContent();
var cc=tags[tags.length-1].id.split("p");
$("c"+cc[1]).style.display="block";
clearMenu();
ck[cc[1]].style.background='url(images/tabbg1.gif)';
 }
else{
clearContent();
clearMenu();
$("welcome").style.display="block"
   }
  }
}
menu.appendChild(tagMenu);
}
//清除菜单样式
function clearMenu(){
for(i=0;i<ck.length;i++){
ck[i].style.background='url(images/tabbg01.gif)';
 }
}
//清除标签样式
function clearStyle(){
for(i=0;i<tags.length;i++){
menu.getElementsByTagName("li")[i].style.background='url(images/tabbg2.gif)';
  }
}
//清除内容
function clearContent(){
for(i=0;i<7;i++){
$("c"+i).style.display="none";
 }
}
}
</script>
非常不错的功能强大代码简单的管理菜单美化版
在线演示https://3water.com/jslib/EXTJS/code.htm
打包下载
仿163
仿126

Javascript 相关文章推荐
js 数组实现一个类似ruby的迭代器
Oct 27 Javascript
javascript ie6兼容position:fixed实现思路
Apr 01 Javascript
html+javascript实现可拖动可提交的弹出层对话框效果
Aug 05 Javascript
javascript同页面多次调用弹出层具体实例代码
Aug 16 Javascript
基于JQuery制作可编辑的表格特效
Dec 23 Javascript
node.js实现爬虫教程
Aug 25 Javascript
浅析JavaScript中的array数组类型系统
Jul 18 Javascript
JS中常用的正则表达式
Sep 29 Javascript
Moment.js实现多个同时倒计时
Aug 26 Javascript
Angular 多模块项目构建过程
Feb 13 Javascript
详解node和ES6的模块导出与导入
Feb 19 Javascript
小程序实现可拖动的悬浮按钮
Sep 07 Javascript
javascript jQuery $.post $.ajax用法
Jul 09 #Javascript
javascript同步Import,同步调用外部js的方法
Jul 08 #Javascript
SWFObject Flash js调用类
Jul 08 #Javascript
Firefox和IE浏览器兼容JS脚本写法小结
Jul 07 #Javascript
图片自动缩小 点击放大
Jul 07 #Javascript
超级退弹代码
Jul 07 #Javascript
Javascript入门学习资料收集整理篇
Jul 06 #Javascript
You might like
在“咖啡之国”感受咖啡文化
2021/03/03 咖啡文化
PHP session有效期session.gc_maxlifetime
2011/04/20 PHP
PHP超级全局变量数组小结
2012/10/04 PHP
php定义数组和使用示例(php数组的定义方法)
2014/03/29 PHP
PHP5多态性与动态绑定介绍
2015/04/03 PHP
PHP操作MySQL的mysql_fetch_* 函数的常见用法教程
2015/12/25 PHP
php简单随机字符串生成方法示例
2017/04/19 PHP
Yii 2中的load()和save()示例详解
2017/08/03 PHP
laravel 5异常错误:FatalErrorException in Handler.php line 38的解决
2017/10/12 PHP
ThinkPHP框架结合Ajax实现用户名校验功能示例
2019/07/03 PHP
javascript比较文档位置
2008/04/08 Javascript
jQuery 1.5 源码解读 面向中高阶JSER
2011/04/05 Javascript
Jquery异步请求数据实例代码
2011/12/28 Javascript
分享一个asp.net pager分页控件
2012/01/04 Javascript
js实现登录验证码
2016/12/22 Javascript
详谈jQuery中使用attr(), prop(), val()获取value的异同
2017/04/25 jQuery
Js判断H5上下滑动方向及滑动到顶部和底部判断的示例代码
2017/11/15 Javascript
jQuery判断自定义属性data-val用法示例
2019/01/07 jQuery
微信小程序实现九宫格抽奖
2020/04/15 Javascript
Node.js对MongoDB进行增删改查操作的实例代码
2019/04/18 Javascript
vue设置一开始进入的页面教程
2019/10/28 Javascript
js实现查询商品案例
2020/07/22 Javascript
vue 路由meta 设置导航隐藏与显示功能的示例代码
2020/09/04 Javascript
微信小程序抽奖组件的使用步骤
2021/01/11 Javascript
[08:44]和酒神一起战斗 DOTA2教你做大人
2014/03/27 DOTA
[01:08:32]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第二场 1月18日
2021/03/11 DOTA
详解从Django Rest Framework响应中删除空字段
2019/01/11 Python
python 进程间数据共享multiProcess.Manger实现解析
2019/09/23 Python
基于Python实现天天酷跑功能
2021/01/06 Python
MCM英国官网:奢侈皮具制品
2017/04/18 全球购物
应付会计岗位职责
2013/12/12 职场文书
优秀员工年终发言演讲稿
2014/01/01 职场文书
舞蹈兴趣小组活动总结
2014/07/07 职场文书
故意伤害人身损害赔偿协议书
2014/11/19 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
python套接字socket通信
2022/04/01 Python