作家
登录

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

作者: 来源:www.28hudong.com 2013-03-30 03:01:45 阅读 我要评论

太激动了...竟然还发现有备份文件<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>在线演示http://www.jb51.net/jslib/EXTJS/code.htm打包下载 仿163仿126

  推荐阅读

  Javascript入门学习第三篇 js运算第1/2页

1, 表达式: 最简单的表达式:直接量或者变量名。var a =1; 直接量表达式的值:本身。 变量表达式的值:该变量所存放或引用的值。 2 , 运算符: 一元运算符: 比如 - 3 二元运算符: 比如 3+4 三元运算符: 比>>>详细阅读


本文标题:非常不错的功能强大代码简单的管理菜单美化版

地址:http://www.17bianji.com/kaifa2/JS/29567.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)