 | 项目搜索 |
|
| |
|
|
代码片段库:
查看代码片段
浏览
| 提交新的代码片段
| 创建代码包
页面顶端的导航菜单
|
类型:
Full Script |
类别:
HTML Manipulation
|
许可证:
GNU General Public License |
语言:
JavaScript
|
描述:
在页面顶端的导航条，效果异常得酷，不可错过 来源：http://www.baron.com.cn
|
该代码片段的版本系列:
| 片段ID |
下载版本 |
提交时间 |
提交人 |
删除 |
| 4819 | 1.0 | 2003-10-25 17:25 | cbd001 |  |
点击"下载版本"来下载该代码片段.
最新版本的代码片段: 1.0
脚本说明:
把如下代码加入<body>区域中
<SCRIPT type=text/jscript>
var eMenu,eItem,eExit,eDesk;
function doMenu(){
eMenu.style.backgroundColor=eDesk.bgcolor;
if ((eItem.offsetLeft+eMenu.offsetWidth-4)<eDesk.offsetWidth) eMenu.style.posLeft=eItem.offsetLeft;
else eMenu.style.posLeft=eDesk.offsetWidth-eMenu.offsetWidth;
eMenu.style.posTop=eDesk.offsetHeight+eDesk.offsetTop;
eMenu.style.visibility='visible';
}
function noMenu(){
if (eMenu && eMenu!=null) {eMenu.style.visibility='hidden';
eMenu.style.posLeft=0;eMenu.style.posTop=0;}
eMenu=eItem=eExit=eDesk=null;
}
function doOver(){
if ("A"==event.srcElement.tagName.toUpperCase()) {
eItem=event.srcElement.parentElement;
eDesk=eItem.parentElement;
eMenu=document.all(eItem.id.replace('item','menu'));
if (eMenu && eMenu!=null) {eMenu.onmouseout=doExit;doMenu();}
else noMenu();}
}
function doExit(){
eExit=event.toElement;
if (eMenu==null || eExit==null) return;
if (!eMenu.contains(eExit) && !eItem.contains(eExit)) noMenu();
}
function doHome(i){
switch (i) {
case 1 : window.external.AddFavorite('http://www.jzzy.com',document.title);break;
case 2 : window.external.AddChannel('http://www.jzzy.com/index.htm');break;
default : event.srcElement.style.behavior='url(#default#homepage)';event.srcElement.setHomePage('http://www.jzzy.com');break;}
return false;
}
function doSel(){
var o=event.srcElement;
if ('select'!=o.tagName.toLowerCase()) return;
var s=o.options[o.selectedIndex].value;
o.selectedIndex=0;
if (s!='1') self.location=s;
}
function doWin(l,a,b){
w=window.open(l,'dhtmlet','toolbar=0');
var winx=Math.ceil((window.screen.width-a)/2);
var winy=Math.ceil((window.screen.height-b)/2);
w.resizeTo(a,b);
w.moveTo(winx,winy);
w.focus();
}
</SCRIPT>
<STYLE type=text/css>BODY {
FONT-SIZE: 11px; OVERFLOW: hidden; FONT-FAMILY: tahoma,arial
}
TABLE {
FONT-SIZE: 11px; OVERFLOW: hidden; FONT-FAMILY: tahoma,arial
}
BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; COLOR: #000000; PADDING-TOP: 0px; BACKGROUND-COLOR: #ffffff; img: 0px
}
A {
COLOR: #000000; TEXT-DECORATION: none
}
.desk {
BACKGROUND: #000000; WIDTH: 100%; PADDING-TOP: 3px; HEIGHT: 20px
}
.menu {
PADDING-RIGHT: 8px; BORDER-TOP: #ffffff 1px solid; PADDING-LEFT: 8px; Z-INDEX: 8; VISIBILITY: hidden; PADDING-BOTTOM: 8px; WIDTH: 160px; LINE-HEIGHT: 15px; PADDING-TOP: 8px; POSITION: absolute
}
.desk SPAN {
HEIGHT: 17px
}
.desk {
COLOR: #ffffff; LETTER-SPACING: 1px
}
.menu {
COLOR: #ffffff; LETTER-SPACING: 1px
}
.desk A {
COLOR: #ffffff
}
.menu A {
COLOR: #ffffff
}
.desk A:hover {
COLOR: #ffcc00
}
.menu A:hover {
COLOR: #ffcc00
}
#div1 {
Z-INDEX: 2; LEFT: 0px; WIDTH: 295px; POSITION: absolute; TOP: 0px; HEIGHT: 60px
}
</STYLE>
<DIV class=menu id=menu11><A href="http://www.jzzy.com/">Windows XP</A><BR><A
href="http://www.jzzy.com/">Windows 2000</A><BR><A
href="http://www.jzzy.com/">Windows ME</A><BR><A
href="http://www.jzzy.com/">Windows 98 SE</A><BR><A
href="http://www.jzzy.com/">Windows 98</A><BR><A
href="http://www.jzzy.com/">Windows 95</A><BR><A
href="http://www.jzzy.com/">Windows CE 3.0</A><BR><A
href="http://www.jzzy.com/">eMbedded Windows NT</A></DIV>
<DIV class=menu id=menu12><A href="http://www.jzzy.com/"
target=_blank>jzzy.COM</A><BR><A
href="http://www.jzzy.com/">这个效果是我做的啦～</A></DIV>
<DIV class=menu id=menu14><A href="http://www.jzzy.com/">一定要支持我哦</A><BR><A
href="http://www.jzzy.com/">一定要来我的网站捧场哦</A></DIV>
<DIV class=menu id=menu15><A href="http://www.jzzy.com/jzzy/leoboard.cgi"
target=_blank>一定要来我的论坛哦</A></DIV>
<DIV class=menu id=menu16><A
href="mailto:[email protected]">[email protected]</A><BR><A
href="mailto:[email protected]">[email protected]</A><BR><A
href="mailto:[email protected]">[email protected]</A></DIV>
<DIV class=desk id=desk1 onmouseover=doOver() onmouseout=doExit() align=right
noWrap bgcolor="#000000"><SPAN>︱</SPAN><SPAN id=item11><A
onclick="return false;"
href="http://www.jzzy.com"> Windows家族产品 </A>︱</SPAN><SPAN
id=item12><A onclick="return false;"
href="http://www.jzzy.com"> LookLook </A>︱</SPAN><SPAN
id=item14><A onclick="return false;"
href="http://www.jzzy.com"> OH
YES^_^ </A>︱</SPAN><SPAN id=item15><A onclick="return false;"
href="http://www.jzzy.com"> LookAgain </A>︱</SPAN><SPAN
id=item16><A onclick="return false;"
href="http://www.jzzy.com"> 我的信箱 </A></SPAN></DIV>
如果您修改了一个代码片段并且觉得很应该让别人共享,您可以把这作为这个代码片段的最新版本提交上来. |
|
