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


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 相关文章推荐
PJ Blog修改-禁止复制的代码和方法
Oct 25 Javascript
基于jquery的气泡提示效果
May 31 Javascript
JSCode all of Brower 全局屏蔽网页右键功能 具体实现
Jun 05 Javascript
js实现数组去重、判断数组以及对象中的内容是否相同
Nov 29 Javascript
jquery判断元素是否隐藏的多种方法
May 06 Javascript
jquery操作checkbox示例分享
Jul 21 Javascript
解决jquery实现的radio重新选中的问题
Jul 03 Javascript
前端弹出对话框 js实现ajax交互
Sep 09 Javascript
react-router4 配合webpack require.ensure 实现异步加载的示例
Jan 18 Javascript
JS实现将对象转化为数组的方法分析
Jan 21 Javascript
浅谈js闭包理解
Mar 28 Javascript
Angular8路由守卫原理和使用方法
Aug 29 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
PHP编码规范-php coding standard
2007/03/16 PHP
判断php数组是否为索引数组的实现方法
2013/06/13 PHP
PHP屏蔽过滤指定关键字的方法
2014/11/03 PHP
php定时执行任务设置详解
2015/02/06 PHP
PHP使用array_fill定义多维数组的方法
2015/03/18 PHP
PHP记录搜索引擎蜘蛛访问网站足迹的方法
2015/04/15 PHP
PHP中的日期时间处理利器实例(Carbon)
2017/06/09 PHP
javascript concat数组累加 示例
2009/09/03 Javascript
心扬JS分页函数代码
2010/09/10 Javascript
JS取文本框中最小值的简单实例
2013/11/29 Javascript
js数组循环遍历数组内所有元素的方法
2014/01/18 Javascript
自定义函数实现IE7与IE8不兼容js中trim函数的问题
2015/02/03 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
2015/10/14 Javascript
原生JavaScript实现瀑布流布局
2020/06/28 Javascript
基于Bootstrap里面的Button dropdown打造自定义select
2016/05/30 Javascript
vuejs项目打包之后的首屏加载优化及打包之后出现的问题
2018/04/01 Javascript
webpack中如何加载静态文件的方法步骤
2019/05/18 Javascript
layui 上传插件 带预览 非自动上传功能的实例(非常实用)
2019/09/23 Javascript
使用kbone解决Vue项目同时支持小程序问题
2019/11/08 Javascript
[54:18]DOTA2-DPC中国联赛 正赛 PSG.LGD vs LBZS BO3 第一场 1月22日
2021/03/11 DOTA
Python正则表达式的使用范例详解
2014/08/08 Python
操作Windows注册表的简单的Python程序制作教程
2015/04/07 Python
用Python写一个模拟qq聊天小程序的代码实例
2019/03/06 Python
python实现维吉尼亚算法
2019/03/20 Python
Python selenium爬取微博数据代码实例
2020/05/22 Python
keras topN显示,自编写代码案例
2020/07/03 Python
Python利用Pillow(PIL)库实现验证码图片的全过程
2020/10/04 Python
医院护士的求职信
2014/01/03 职场文书
时尚休闲吧创业计划书
2014/01/25 职场文书
党课培训主持词
2014/04/01 职场文书
财务担保书范文
2014/04/02 职场文书
读书小明星事迹材料
2014/05/03 职场文书
酒店管理失职检讨书
2014/09/16 职场文书
房产协议书范本
2014/10/18 职场文书
党员贯彻十八大精神思想汇报范文
2014/10/25 职场文书
亮剑观后感600字
2015/06/05 职场文书