非常酷的js图形渐隐导航菜单栏_javascript技巧

来源：动视网责编：小采时间：2020-11-27 20:37:59

非常酷的js图形渐隐导航菜单栏_javascript技巧

非常酷的js图形渐隐导航菜单栏_javascript技巧: body { background:#799AE1; margin:0px; font:normal 12px 宋体; } table { border:0px; } td { font:normal 12px 宋体; } img { vertical-align:bottom; border:0px; } a { font:normal 1

推荐度：

点击下载本文 文档为doc格式

导读非常酷的js图形渐隐导航菜单栏_javascript技巧: body { background:#799AE1; margin:0px; font:normal 12px 宋体; } table { border:0px; } td { font:normal 12px 宋体; } img { vertical-align:bottom; border:0px; } a { font:normal 1

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<meta name="keywords" content=""> 
<style type=text/css> 
body { background:#799AE1; margin:0px; font:normal 12px 宋体; } 
table { border:0px; } 
td { font:normal 12px 宋体; } 
img { vertical-align:bottom; border:0px; } 
a { font:normal 12px 宋体; color:#215DC6; text-decoration:none; } 
a:hover { color:#428EFF } 
.sec_menu { border-left:1px solid white; border-right:1px solid white; border-bottom:1px solid white; overflow:hidden; background:#D6DFF7; } 
.menu_title { } 
.menu_title span { position:relative; top:2px; left:8px; color:#215DC6; font-weight:bold; } 
.menu_title2 { } 
.menu_title2 span { position:relative; top:2px; left:8px; color:#428EFF; font-weight:bold; } 
</style> 
 
function menuShow(obj,maxh,obj2) 
{ 
 if(obj.style.pixelHeight<maxh) 
 { 
 obj.style.pixelHeight+=maxh/20; 
 obj.filters.alpha.opacity+=5; 
 obj2.background="images/title_bg_hide.gif"; 
 if(obj.style.pixelHeight==maxh/10) 
 obj.style.display='block'; 
 myObj=obj; 
 myMaxh=maxh; 
 myObj2=obj2; 
 setTimeout('menuShow(myObj,myMaxh,myObj2)','5'); 
 } 
} 
function menuHide(obj,maxh,obj2) 
{ 
 if(obj.style.pixelHeight>0) 
 { 
 if(obj.style.pixelHeight==maxh/20) 
 obj.style.display='none'; 
 obj.style.pixelHeight-=maxh/20; 
 obj.filters.alpha.opacity-=5; 
 obj2.background="images//title_bg_show.gif"; 
 myObj=obj; 
 myMaxh=maxh 
 myObj2=obj2; 
 setTimeout('menuHide(myObj,myMaxh,myObj2)','5'); 
 } 
 else 
 if(whichContinue) 
 whichContinue.click(); 
} 
function menuChange(obj,maxh,obj2) 
{ 
 if(obj.style.pixelHeight) 
 { 
 menuHide(obj,maxh,obj2); 
 whichOpen=''; 
 whichcontinue=''; 
 } 
 else 
 if(whichOpen) 
 { 
 whichContinue=obj2; 
 whichOpen.click(); 
 } 
 else 
 { 
 menuShow(obj,maxh,obj2); 
 whichOpen=obj2; 
 whichContinue=''; 
 } 
} 
</ script> 
<base target=main> 
</head>

<body onselectstart="return false;" ondragstart="return false;" oncontextmenu="return false;"> 
<table cellpadding=0 cellspacing=0 width=158 align=center> 
 <tr style="cursor:hand;"> 
 <td height=42 valign=bottom> 
 <img src=images/title.gif width=158 height=38> 
 </td> 
 </tr> 
</table> 
 
<table cellpadding=0 cellspacing=0 width=158 align=center> 
 <tr style="cursor:hand;"> 
 <td height=25 class=menu_title onmouseover=this.className='menu_title2'; onmouseout=this.className='menu_title'; background=http://images.jojoo.net/js/title_bg_hide.gif id=menuTitle1 onclick="menuChange(menu1,80,menuTitle1);"> 
 系统选项 
 </td> 
 </tr> 
 <tr> 
 <td> 
 
 <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;"> 
 <tr> 
 <td height=20> 
 <img src=images/icon_safe.gif> 
 安全选项 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_recycle.gif> 
 垃圾邮件选项 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_dynamic.gif> 
 动态规则选项 
 </td> 
 </tr> 
 </table> 
 
 </td> 
 </tr> 
</table> 
 
 var whichOpen=menuTitle1; 
 var whichContinue=''; 
</ script> 
 
<table cellpadding=0 cellspacing=0 width=158 align=center> 
 <tr style="cursor:hand;"> 
 <td height=25 class=menu_title onmouseover=this.className='menu_title2'; onmouseout=this.className='menu_title'; background=http://images.jojoo.net/js/title_bg_show.gif id=menuTitle2 onclick="menuChange(menu2,120,menuTitle2);"> 
 系统规则 
 </td> 
 </tr> 
 <tr> 
 <td> 
 
 <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;"> 
 <tr> 
 <td height=20> 
 <img src=images/icon_ip.gif> 
 IP过滤规则 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_mailer.gif> 
 信封过滤规则 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_mailheader.gif> 
 信头过滤规则 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_mailbody.gif> 
 信体过滤规则 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_accessory.gif> 
 附件过滤规则 
 </td> 
 </tr> 
 </table> 
 
 </td> 
 </tr> 
</table> 
 
<table cellpadding=0 cellspacing=0 width=158 align=center> 
 <tr style="cursor:hand;"> 
 <td height=25 class=menu_title onmouseover=this.className='menu_title2'; onmouseout=this.className='menu_title'; background=http://images.jojoo.net/js/title_bg_show.gif id=menuTitle3 onclick="menuChange(menu3,120,menuTitle3);"> 
 系统管理 
 </td> 
 </tr> 
 <tr> 
 <td> 
 
 <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;"> 
 <tr> 
 <td height=20> 
 <img src=images/icon_user.gif> 
 用户管理 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_course.gif> 
 进程管理 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_host.gif> 
 主机运行状态 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_data.gif> 
 数据备份 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_recycle.gif> 
 垃圾目录管理 
 </td> 
 </tr> 
 </table> 
 
 </td> 
 </tr> 
</table> 
 
<table cellpadding=0 cellspacing=0 width=158 align=center> 
 <tr style="cursor:hand;"> 
 <td height=25 class=menu_title onmouseover=this.className='menu_title2'; onmouseout=this.className='menu_title'; background=http://images.jojoo.net/js/title_bg_show.gif id=menuTitle4 onclick="menuChange(menu4,140,menuTitle4);"> 
 系统统计 
 </td> 
 </tr> 
 <tr> 
 <td> 
 
 <table cellpadding=0 cellspacing=0 align=center width=135 style="position:relative;top:10px;"> 
 <tr> 
 <td height=20> 
 <img src=images/icon_ip.gif> 
 IP过滤统计 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_mailer.gif> 
 信封过滤统计 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_mailheader.gif> 
 信头过滤统计 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_mailbody.gif> 
 信体过滤统计 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_accessory.gif> 
 附件过滤统计 
 </td> 
 </tr> 
 <tr> 
 <td height=20> 
 <img src=images/icon_dynamic.gif> 
 动态规则统计 
 </td> 
 </tr> 
 </table> 
 
 </td> 
 </tr> 
</table> 
 
<table cellpadding=0 cellspacing=0 width=158 align=center> 
 <tr style="cursor:hand;"> 
 <td height=25 class=menu_title onmouseover=this.className='menu_title2'; onmouseout=this.className='menu_title'; background=http://images.jojoo.net/js/title_bg_quit.gif> 
 退出系统 
 </td> 
 </tr> 
</table> 
</body>

</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

非常酷的js图形渐隐导航菜单栏_javascript技巧

推荐度：

点击下载本文 文档为doc格式

标签：技巧 js javascript

热门焦点

非常酷的js图形渐隐导航菜单栏_javascript技巧

非常酷的js图形渐隐导航菜单栏_javascript技巧

非常酷的js图形渐隐导航菜单栏_javascript技巧

最新推荐

猜你喜欢

热门推荐