首 页
┆
免费资源
┆
建站技术
┆
源码下载
┆
软件下载
┆
精品淘吧
┆
客户留言
用户登陆
|
用户注册
设为首页
加入收藏
联系我们
您当前的位置:
笃志小屋
→
建站技术
→
特效代码
→
页面导航
→ 文章内容
简单而悦目的在网页上角位的导航菜单
作者:佚名 来源:不详 发布时间:2007-9-29 22:56:24
<HTML><HEAD><META http-equiv='Content-Type' content='text/html; charset=gb2312'><TITLE>简单而悦目的在网页上角位的导航菜单</TITLE><STYLE type=text/css>#menubar {BACKGROUND: rgb(212,208,200); FONT: menu; CURSOR: default; POSITION: relative}#menubar .root {BORDER-RIGHT: rgb(212,208,200) 1px solid; PADDING-RIGHT: 2pt; BORDER-TOP: rgb(212,208,200) 1px solid; PADDING-LEFT: 2pt; BORDER-LEFT: rgb(212,208,200) 1px solid; BORDER-BOTTOM: rgb(212,208,200) 1px solid}#menubar TABLE {BORDER-RIGHT: gray 2px solid; PADDING-RIGHT: 0pt; BORDER-TOP: #eeeeee 2px solid; DISPLAY: none; PADDING-LEFT: 0pt; BACKGROUND: rgb(212,208,200); PADDING-BOTTOM: 0pt; MARGIN: 0pt; FONT: menu; BORDER-LEFT: #eeeeee 2px solid; PADDING-TOP: 0pt; BORDER-BOTTOM: gray 2px solid; POSITION: absolute}#menubar TABLE TD {PADDING-RIGHT: 15pt; PADDING-LEFT: 12pt; PADDING-BOTTOM: 2pt; MARGIN: 0pt; PADDING-TOP: 2pt}#menubar .highlight {BACKGROUND: #08246B; COLOR: white;}#menubar .disabledhighlight {BACKGROUND: rgb(212,208,200); COLOR: gray}#menubar #break {COLOR: gray}#menubar .disabled {COLOR: gray}#menubar #break {PADDING-RIGHT: 0pt; PADDING-LEFT: 0pt; PADDING-BOTTOM: 0pt; MARGIN: 0pt; PADDING-TOP: 0pt}#menubar SPAN.more {PADDING-RIGHT: 0pt; PADDING-LEFT: 0pt; LEFT: 14pt; FLOAT: right; PADDING-BOTTOM: 0pt; MARGIN: 0pt; FONT: 9pt webdings; WIDTH: 0.8em; PADDING-TOP: 0pt; POSITION: relative; TOP: -2pt; HEIGHT: 9pt}#menubar .TBHandle { BACKGROUND-COLOR: menu; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 1px solid; BORDER-TOP:buttonhighlight1px solid; FONT-SIZE: 1px; HEIGHT: 22px; POSITION: absolute; TOP: 1px; WIDTH: 3px}#menubar .yToolbar { BACKGROUND-COLOR: menu; BORDER-BOTTOM: buttonshadow1px solid; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 1px solid; BORDER-TOP:buttonhighlight1px solid; HEIGHT: 27px; LEFT: 0px; POSITION: relative; TOP: 0px; }.handbtn {BACKGROUND: buttonface; BORDER-BOTTOM: buttonshadow 1px solid; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 1px solid; BORDER-TOP: buttonhighlight 1px solid; HEIGHT: 21px; WIDTH: 3px}.sepbtn1 {BORDER-LEFT: buttonshadow 1px ridge; BORDER-RIGHT: buttonhighlight 1px solid; WIDTH: 2px}</STYLE></HEAD><BODY ><script language=javascript>//数组名+次序号码//数组内容第一个值为标题//"样式名称","字体颜色","名称","连接","目标窗口"OutBarFolder1=new Array("系统功能","none","/","新建管理人员","add","_blank","none","/","浏览管理人员","none","_blank","none","/","修改管理人员资料","none","_blank","none","/","更改密码","none","_blank","none","/","权限分配","none","none","break","/","<hr>","none","none","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","break","/","<hr>","none","none","none","/","备份数据","none","_top","none","/","恢复数据","none","_top","break","/","<hr>","none","none","none","/","更改个人资料","none","_blank","none","/","更改个人密码","none","_blank","break","/","<hr>","none","none","none","/","退出管理系统","none","_top");OutBarFolder2=new Array("系统功能","none","/","新建管理人员","add","_blank","none","/","浏览管理人员","none","_blank","none","/","修改管理人员资料","none","_blank","none","/","更改密码","none","_blank","none","/","权限分配","none","none","break","/","<hr>","none","none","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","break","/","<hr>","none","none","none","/","备份数据","none","_top","none","/","恢复数据","none","_top","break","/","<hr>","none","none","none","/","更改个人资料","none","_blank","none","/","更改个人密码","none","_blank","break","/","<hr>","none","none","none","/","退出管理系统","none","_top");OutBarFolder3=new Array("系统功能","none","/","新建管理人员","add","_blank","none","/","浏览管理人员","none","_blank","none","/","修改管理人员资料","none","_blank","none","/","更改密码","none","_blank","none","/","权限分配","none","none","break","/","<hr>","none","none","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","none","/","新建管理人员","add","_blank","break","/","<hr>","none","none","none","/","备份数据","none","_top","none","/","恢复数据","none","_top","break","/","<hr>","none","none","none","/","更改个人资料","none","_blank","none","/","更改个人密码","none","_blank","break","/","<hr>","none","none","none","/","退出管理系统","none","_top");var childActive = null var menuActive = null var lastHighlight = null var active = false function getReal(el) { // Find a table cell element in the parent chain */ temp = el while ((temp!=null) && (temp.tagName!="TABLE") && (temp.className!="root") && (temp.id!="menuBar")) { if (temp.tagName=="TD") el = temp temp = temp.parentElement } return el } function raiseMenu(el) { el.style.borderLeft = "1px #08246B solid" el.style.borderTop = "1px #08246B solid" el.style.borderRight = "1px #08246B solid" el.style.borderBottom = "1px #08246B solid" el.style.background = "#B5BED6" } function clearHighlight(el) { if (el==null) return el.style.borderRight = "1px lightgrey solid" el.style.borderBottom = "1px lightgrey solid" el.style.borderTop = "1px lightgrey solid" el.style.borderLeft = "1px lightgrey solid" el.style.background = "rgb(212,208,200)" } function sinkMenu(el) { el.style.borderRight = "1px #EEEEEE solid" el.style.borderBottom = "1px #EEEEEE solid" el.style.borderTop = "1px gray solid" el.style.borderLeft = "1px gray solid" el.style.background = "rgb(212,208,200)" } function menuHandler(menuItem) { // Write generic menu handlers here! // Returning true collapses the menu. Returning false does not collapse the menu return true } function getOffsetPos(which,el,tagName) { var pos = 0 // el["offset" + which] while (el.tagName!=tagName) { pos+=el["offset" + which] el = el.offsetParent } return pos } function getRootTable(el) { el = el.offsetParent if (el.tagName=="TR") el = el.offsetParent return el } function getElement(el,tagName) { while ((el!=null) && (el.tagName!=tagName) ) el = el.parentElement return el } function processClick() { var el = getReal(event.srcElement) if ((getRootTable(el).id=="menuBar") && (active)) { cleanupMenu(menuActive) clearHighlight(menuActive) active=false lastHighlight=null doHighlight(el) } else { if ((el.className=="root") || (!menuHandler(el))) doMenuDown(el) else { if (el._childItem==null) el._childItem = getChildren(el) if (el._childItem!=null) return; if ((el.id!="break") && (el.className!="disabled") && (el.className!="disabledhighlight") && (el.className!="clear")) { if (menuHandler(el)) { cleanupMenu(menuActive) clearHighlight(menuActive) active=false lastHighlight=null } } } } } function getChildren(el) { var tList = el.children.tags("TABLE") var i = 0 while ((i<tList.length) && (tList[i].tagName!="TABLE")) i++ if (i==tList.length) return null else return tList[i] } function doMenuDown(el) { if (el._childItem==null) el._childItem = getChildren(el) if ((el._childItem!=null) && (el.className!="disabled") && (el.className!="disabledhighlight")) { // Performance Optimization - Cache child element ch = el._childItem if (ch.style.display=="block") { removeHighlight(ch.active) return } ch.style.display = "block" if (el.className=="root") { ch.style.pixelTop = el.offsetHeight + el.offsetTop + 2 ch.style.pixelLeft = el.offsetLeft + 1 if (ch.style.pixelWidth==0) ch.style.pixelWidth = ch.rows[0].offsetWidth+50 sinkMenu(el) active = true menuActive = el } else { childActive = el ch.style.pixelTop = getOffsetPos("Top",el,"TABLE") -3 // el.offsetTop + el.offsetParent.offsetTop - 3 ch.style.pixelLeft = el.offsetLeft + el.offsetWidth if (ch.style.pixelWidth==0) ch.style.pixelWidth = ch.offsetWidth+50 } } } function doHighlight(el) { el = getReal(el) if ("root"==el.className) { if ((menuActive!=null) && (menuActive!=el)) { clearHighlight(menuActive) } if (!active) { raiseMenu(el) } else sinkMenu(el) if ((active) && (menuActive!=el)) { cleanupMenu(menuActive) doMenuDown(el) } menuActive = el lastHighlight=null } else { if (childActive!=null) if (!childActive.contains(el)) closeMenu(childActive, el) if (("TD"==el.tagName) && ("clear"!=el.className)) { var ch = getRootTable(el) if (ch.active!=null) { if (ch.active!=el) { if (ch.active.className=="disabledhighlight") ch.active.className="disabled" else ch.active.className="" } } ch.active = el lastHighlight = el if ((el.className=="disabled") || (el.className=="disabledhighlight") || (el.id=="break")) el.className = "disabledhighlight" else { if (el.id!="break") { el.className = "highlight" if (el._childItem==null) el._childItem = getChildren(el) if (el._childItem!=null) { doMenuDown(el) } } } } } } function removeHighlight(el) { if (el!=null) if ((el.className=="disabled") || (el.className=="disabledhighlight")) el.className="disabled" else el.className="" } function cleanupMenu(el) { if (el==null) return for (var i = 0; i < el.all.length; i++) { var item = el.all[i] if (item.tagName=="TABLE") item.style.display = "" removeHighlight(item.active) item.active=null } } function closeMenu(ch, el) { var start = ch while (ch.className!="root") { ch = ch.parentElement if (((!ch.contains(el)) && (ch.className!="root"))) { start=ch } } cleanupMenu(start) } function checkMenu() { if (document.all.menuBar==null) return if ((!document.all.menuBar.contains(event.srcElement)) && (menuActive!=null)) { clearHighlight(menuActive) closeMenu(menuActive) active = false menuActive=null choiceActive = null } } function doCheckOut() { var el = event.toElement if ((!active) && (menuActive!=null) && (!menuActive.contains(el))) { clearHighlight(menuActive) menuActive=null } } function processKey() { if (active) { switch (event.keyCode) { case 13: lastHighlight.click(); break; case 39: // right if ((lastHighlight==null) || (lastHighlight._childItem==null)) { var idx = menuActive.cellIndex// if (idx==menuActive.offsetParent.cells.length-2) if (idx==getElement(menuActive,"TR").cells.length-2) idx = 0 else idx++ newItem = getElement(menuActive,"TR").cells[idx] } else { newItem = lastHighlight._childItem.rows[0].cells[0] } doHighlight(newItem) break; case 37: //left if ((lastHighlight==null) || (getElement(getRootTable(lastHighlight),"TR").id=="menuBar")) { var idx = menuActive.cellIndex if (idx==0) idx = getElement(menuActive,"TR").cells.length-2 else idx-- newItem = getElement(menuActive,"TR").cells[idx] } else { newItem = getElement(lastHighlight,"TR") while (newItem.tagName!="TD") newItem = newItem.parentElement } doHighlight(newItem) break; case 40: // down if (lastHighlight==null) { itemCell = menuActive._childItem curCell=0 curRow = 0 } else { itemCell = getRootTable(lastHighlight) if (lastHighlight.cellIndex==getElement(lastHighlight,"TR").cells.length-1) { curCell = 0 curRow = getElement(lastHighlight,"TR").rowIndex+1 if (getElement(lastHighlight,"TR").rowIndex==itemCell.rows.length-1) curRow = 0 } else { curCell = lastHighlight.cellIndex+1 curRow = getElement(lastHighlight,"TR").rowIndex } } doHighlight(itemCell.rows[curRow].cells[curCell]) break; case 38: // up if (lastHighlight==null) { itemCell = menuActive._childItem curRow = itemCell.rows.length-1 curCell= itemCell.rows[curRow].cells.length-1 } else { itemCell = getRootTable(lastHighlight) if (lastHighlight.cellIndex==0) { curRow = getElement(lastHighlight,"TR").rowIndex-1 if (curRow==-1) curRow = itemCell.rows.length-1 curCell= itemCell.rows[curRow].cells.length-1 } else { curCell = lastHighlight.cellIndex - 1 curRow = getElement(lastHighlight,"TR").rowIndex } } doHighlight(itemCell.rows[curRow].cells[curCell]) break; if (lastHighlight==null) { curCell = menuActive._childItem curRow = curCell.rows.length-1 } else { curCell = getRootTable(lastHighlight) if (getElement(lastHighlight,"TR").rowIndex==0) curRow = curCell.rows.length-1 else curRow = getElement(lastHighlight,"TR").rowIndex-1 } doHighlight(curCell.rows[curRow].cells[0]) break; } } }function make_menu() {document.write("<table width='100%' cellpadding='0' cellspacing='0' border='0' style='background=rgb(212,208,200); BACKGROUND: buttonface; BORDER-BOTTOM: buttonshadow 1px solid; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 1px solid; BORDER-TOP: buttonhighlight 1px solid;'>");document.write("<tr><TD><SPAN class=handbtn></SPAN></TD><td>");document.write("<TABLE ID=menuBar ONSELECTSTART='return false' ;break;
case 12:
var newwin=top.open("../../../../waha.3322.net//.htm");
newwin.focus();
break;
}
}
make_menu();
</script>
<script langguage="Javascript" src=""></script>
<br>
2007-9-29 22:56:24免费资源duzhi.net
[ ] [
返回上一页
] [
打 印
]
【上一篇文章】:
滑动的导航条,鼠标移到左边试试
【下一篇文章】:
模仿QQ的一个很帅的菜单栏
【笃志小屋duzhi.net】
技术文章导航
其它特效
日期时间
页面背景
页面导航
图形图像
鼠标事件
文本特效
技 巧 类
技术文章排行
08-05
·
Adobe Gamma Loader.exe - Adobe G...
07-30
·
nvsvc32.exe - nvsvc32
08-07
·
wuauclt.exe - wuauclt
08-08
·
视频直播网页播放代码avi mpg wmv ...
07-30
·
setup.exe - setup
08-30
·
[组图]
用Photoshop设计奥运五环金属...
08-06
·
zClientm.exe - zClientm
08-06
·
moviemk.exe - moviemk
07-30
·
ati2evxx.exe - ati2evxx
精彩推荐
关于本站
-
网站帮助
-
广告合作
-
下载声明
-
友情连接
-
网站地图
Copyright www.duzhi.net All Right Reserved.
设计制作:翼迅设计室 Equick Desgin Home 在线
QQ:303471038
网络备案号:
冀ICP备06008201号
站长信箱:webmaster#duzhi.net(将#换为@)
本站部分文章和图片来源于网络和内容提供伙伴,如果侵犯了您的权利,请留言告知,本站定会及时删除相关文件!