2009 八月 - 乱舞春秋

八月, 2009

八 30th, 2009下拉式菜单-菜单导航特效(0)

AJAX技术大全 ASP.NET电子教程，编程学院
欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效：

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style>  </style> <meta name="keywords" content="下拉式菜单导航"> <meta name="description" content="一个下拉式菜单导航脚本"> </head> <body bgcolor="#FFFFFF"> <ilayer id="dropmenu01" height=35px> <layer id="dropmenu02" visibility=show> <a href="#">点这里看本站栏目</a> </layer> </ilayer> <script language="JavaScript1.2"> //如果想关闭 "fade"（消隐）效果，将如下参数设置成false，适用于IE用户。 var enableeffect=true //将如下数组修改成你自己的。 var selection=new Array() selection[0]='<a href="www.ue100.com/~lionwind">本站首页</a> ' selection[1]='<a href="#">一个连接</a> ' selection[2]='<a href="../../navigation/applet/appletindex.htm">JavaApplet</a> ' selection[3]='<a href="#">一个连接</a> ' selection[4]='<a href="#">一个连接</a> ' selection[5]='<a href="#">一个连接</a> ' selection[6]='<a href="#">一个连接</a> ' selection[7]='<a href="#">一个连接</a>' if (document.layers) document.dropmenu01.document.dropmenu02.visibility='show' function dropit2(){ if (document.all){ dropmenu03.style.left=document.body.scrollLeft event.clientX-event.offsetX dropmenu03.style.top=document.body.scrollTop event.clientY-event.offsetY 18 if (dropmenu03.style.visibility=="hidden"){ if (enableeffect) dropmenu03.filters.revealTrans.apply() dropmenu03.style.visibility="visible" if (enableeffect) dropmenu03.filters.revealTrans.play() } else{ hidemenu() } } } function dropit(e){ if (document.dropmenu03.visibility=="hide") document.dropmenu03.visibility="show" else document.dropmenu03.visibility="hide" document.dropmenu03.left=e.pageX-e.layerX document.dropmenu03.top=e.pageY-e.layerY 19 return false } function hidemenu(){ if (enableeffect) dropmenu03.filters.revealTrans.stop() dropmenu03.style.visibility="hidden" } function hidemenu2(){ document.dropmenu03.visibility="hide" } if (document.layers){ document.dropmenu01.document.dropmenu02.captureEvents(Event.CLICK) document.dropmenu01.document.dropmenu02.onclick=dropit } else if (document.all) document.body.onclick=hidemenu </script>   <div id="dropmenu03" style="position:absolute;left:0;top:0;layer-background-color:seashell;background-color:seashell;width:100;visibility:hidden;border:1px solid black;padding:0px"> <script language="JavaScript1.2"> if (document.all) dropmenu03.style.padding='4px' for (i=0;i <selection.length;i ) document.write(selection[i]) </script> </div> <script language="JavaScript1.2"> if (document.layers){ document.dropmenu03.captureEvents(Event.CLICK) document.dropmenu03.onclick=hidemenu2 } </script> </body> </html> <a href="http://www.20blog.cn/Dev/HTML/jsrun/">欢迎访问乱舞春秋网页特效集</a>

八 30th, 2009一个不错的下拉菜单，加上图片后效果极好-菜单导航特效(0)

乱舞春秋站长工具大全，最全的查询工具，加密工具，换算工具！

欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效：

要完成此效果需要两个步骤 第一步：把如下代码加入到<head>区域中 <script language="JavaScript1.2"> scores = new Array(20);var numTotal=0;NS4 = (document.layers) ? 1 : 0;IE4 = (document.all) ? 1 : 0;ver4 = (NS4 || IE4) ? 1 : 0;if (ver4) { with (document) { write("<STYLE TYPE='text/css'>"); if (NS4) { write(".parent {position:absolute; visibility:visible}"); write(".child {position:absolute; visibility:visible}"); write(".regular {position:absolute; visibility:visible}") } else { write(".child {display:none}") } write("</STYLE>"); }}function getIndex(el) { ind = null; for (i=0; i<document.layers.length; i ) { whichEl = document.layers[i]; if (whichEl.id == el) { ind = i; break; } } return ind;}function arrange() { nextY = document.layers[firstInd].pageY document.layers[firstInd].document.height; for (i=firstInd 1; i<document.layers.length; i ) { whichEl = document.layers[i]; if (whichEl.visibility != "hide") { whichEl.pageY = nextY; nextY = whichEl.document.height; } }}function initIt(){ if (!ver4) return; if (NS4) { for (i=0; i<document.layers.length; i ) { whichEl = document.layers[i]; if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide"; } arrange(); } else { divColl = document.all.tags("DIV"); for (i=0; i <divColl.length; i ) { whichEl = divColl(i); if (whichEl.className == "child") whichEl.style.display = "none"; } }}function expandIt(el) { if (!ver4) return; if (IE4) { whichEl1 = eval(el "Child"); for(i=1;i<=numTotal;i ){ whichEl = eval(scores[i] "Child"); if(whichEl!=whichEl1) { whichEl.style.display = "none"; } } whichEl1 = eval(el "Child"); if (whichEl1.style.display == "none") { whichEl1.style.display = "block"; } else { whichEl1.style.display = "none"; } } else { whichEl = eval("document." el "Child"); for(i=1;i<=numTotal;i ){ whichEl = eval("document." scores[i] "Child"); if(whichEl!=whichEl1) { whichEl.visibility = "hide"; } } if (whichEl.visibility == "hide") { whichEl.visibility = "show"; } else { whichEl.visibility = "hide"; } arrange(); }}onload = initIt; </script> 第二步：把如下代码加入到<body>区域中 <div id='KB1Parent' class='parent'><a href="#" onClick="expandIt('KB1'); return false"> <img src='http://www.20blog.cn/images/face/image21.gif' BORDER=0 width="26" height="13" onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">主类一</a></div> <div id='KB1Child' class='child'> <a href='link1.htm' target='_target'> <img src='http://www.20blog.cn/UploadPic/userface/no1323.jpg' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类一</a> <a href='link2.htm' target='_target'> <img src='http://www.20blog.cn/images/face/image21.gif' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类二</a> <a href='link3.htm' target='_target'> <img src='http://www.20blog.cn/UploadPic/userface/no1323.jpg' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类三</a> <a href='link8.htm' target='_target'> <img src='http://www.20blog.cn/images/face/image21.gif' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类四</a></div> <div id='KB2Parent' class='parent'><a href="#" onClick="expandIt('KB2'); return false"> <img src='http://www.20blog.cn/UploadPic/userface/no1323.jpg' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">主类二</a></div> <div id='KB2Child' class='child'> <a href='link1.htm' target='_target'> <img src='http://www.20blog.cn/images/face/image21.gif' BORDER=0 width="24" height="14" onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类一</a> <a href='link9.htm' target='_target'> <img src='http://www.20blog.cn/images/link.gif' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类二</a> <a href='link10.htm' target='_target'> <img src='http://www.20blog.cn/UploadPic/userface/no1323.jpg' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类三</a> <a href='link11.htm' target='_target'> <img src='http://www.20blog.cn/images/link.gif' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类四</a> </div> <div id='KB3Parent' class='parent'><a href="#" onClick="expandIt('KB3'); return false"> <img src='http://www.20blog.cn/UploadPic/userface/no1323.jpg' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">主类三</a></div> <div id='KB3Child' class='child'> <a href='link1.htm' target='_target'> <img src='http://www.20blog.cn/images/face/image21.gif' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类一</a> <a href='link2.htm' target='_target'> <img src='http://www.20blog.cn/UploadPic/userface/no1323.jpg' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类二</a> <a href='link9.htm' target='_target'> <img src='http://www.20blog.cn/images/face/image21.gif' BORDER=0 onclick="javascript:window.open(this.src);" style="CURSOR: pointer" onload="return imgzoom(this,550)">分类三</a></div> <a href="http://www.20blog.cn/Dev/HTML/jsrun/">欢迎访问乱舞春秋网页特效集</a>

八 30th, 2009右键图形菜单-菜单导航特效(0)

欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效：

<HTML><HEAD><TITLE>右键图形菜单－乱舞春秋<a target="_blank" href="http://www.20blog.cn/" class="wordstyle">WEB开发</a>www.alixixi.com</TITLE> <META content="text/html; charset=gb2312" http-equiv=Content-Type> <STYLE type=text/css>BODY { FONT-SIZE: 12px; } .info{FONT-SIZE: 14px;color:#FFFFFF;font-family:@Tahoma,@宋体;width:20px} TABLE { CURSOR: default; FONT-SIZE: 12px; MARGIN: 0px } TR { HEIGHT: 20px } TR.over { BACKGROUND-COLOR: #000080; COLOR: #ffffff; CURSOR: default; FONT-SIZE: 12px } TR.out { BACKGROUND-COLOR: #efefef; COLOR: #000000; FONT-SIZE: 12px } DIV.rm_div { BACKGROUND-COLOR: #efefef; BORDER-BOTTOM: #ffffff 1px outset; BORDER-LEFT: #ffffff 1px outset; BORDER-RIGHT: #ffffff 1px outset; BORDER-TOP: #ffffff 1px outset; DISPLAY: none; FILTER: Alpha(Opacity=’95′); HEIGHT: 0px; PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; PADDING-TOP: 1px; POSITION: absolute; WIDTH: 0px } HR.sperator { BORDER-BOTTOM: #ffffff 1px inset; BORDER-LEFT: #ffffff 1px inset; BORDER-RIGHT: #ffffff 1px inset; BORDER-TOP: #ffffff 1px inset; WIDTH: 95% } .w2kfont { FONT-FAMILY: Tahoma; FONT-SIZE: 8pt } </STYLE> <SCRIPT language=JScript> \n”; HTMLstr = “\n”; HTMLstr = “\n”; HTMLstr = “ <div id='E_rbpm' class='rm_div'>\n”; // rbpm = right button pop menu HTMLstr = “ <table width='100%' border='0' cellspacing='0'>\n”; HTMLstr = “ <tr> <td height='264' width='20' valign='bottom' bgcolor='#000000' onclick=window.event.cancelBubble=true; class=info>作制娃海 : 窗视忧无\n”; HTMLstr = “</td> <td height='264' width='120' style='padding: 1' valign='bottom'>\n”; HTMLstr = “ <table width='100%' border='0' cellspacing='0'>\n”; HTMLstr = “\n”; HTMLstr = “</table> </td> </tr> </table> \n”; HTMLstr = “</div> \n”; HTMLstr = ““; HTMLstr = “\n”; HTMLstr = “\n”; } function AddExtendMenu(id,img,wh,name,parent) { var TempStr = “”; eval(“A_” parent “.length “); eval(“A_” parent “[A_" parent ".length-1] = id”); // 将此项注册到父菜单项的ID数组中去 TempStr = “ <div id='E_" id "' class='rm_div'>\n”; TempStr = “ <table width='100%' border='0' cellspacing='0'>\n”; TempStr = ““; TempStr = “</table> \n”; TempStr = “</div> \n”; TempStr = ““; TempStr = ““; HTMLstr = HTMLstr.replace(““,TempStr); eval(“A_” id ” = new Array()”); TempStr = “”; TempStr = “\n”; TempStr = “ <tr id='P_" id "' class='out'"; TempStr = " onmouseover='P_OnMouseOver(\"" id "\",\"" parent "\")'"; TempStr = " onmouseout='P_OnMouseOut(\"" id "\",\"" parent "\")'"; TempStr = " onmouseup=window.event.cancelBubble=true;"; TempStr = " onclick=window.event.cancelBubble=true;"; TempStr = "> <td nowrap>“; TempStr = “0 ” name ” </td> <td style='font-family: webdings; text-align: ;'>4″; TempStr = “</td> </tr> \n”; TempStr = ““; HTMLstr = HTMLstr.replace(““,TempStr); } function AddItem(id,img,wh,name,parent,location) { var TempStr = “”; var ItemStr = ““; if(id == “sperator”) { TempStr = ItemStr “\n”; TempStr = “ <tr class='out' onclick='window.event.cancelBubble=true;' onmouseup='window.event.cancelBubble=true;'> <td colspan='2' height='1'> <hr class='sperator'></td> </tr> “; TempStr = ““; HTMLstr = HTMLstr.replace(““,TempStr); return; } if(HTMLstr.indexOf(ItemStr) != -1) { alert(“I_” id “already exist!”); return; } TempStr = ItemStr “\n”; TempStr = “ <tr id='I_" id "' class='out'"; TempStr = " onmouseover='I_OnMouseOver(\"" id "\",\"" parent "\")'"; TempStr = " onmouseout='I_OnMouseOut(\"" id "\")'"; TempStr = " onclick='window.event.cancelBubble=true;'"; if(location == null) TempStr = " onmouseup='I_OnMouseUp(\"" id "\",\"" parent "\",null)'"; else TempStr = " onmouseup='I_OnMouseUp(\"" id "\",\"" parent "\",\"" location "\")'"; TempStr = "> <td nowrap>“; TempStr =”” wh ” ” name ” “; TempStr = “</td> <td></td> </tr> \n”; TempStr = ““; HTMLstr = HTMLstr.replace(““,TempStr); } function GetMenu() { return HTMLstr; } function I_OnMouseOver(id,parent) { var Item; if(parent != “rbpm”) { var ParentItem; ParentItem = eval(“P_” parent); ParentItem.className=”over”; } Item = eval(“I_” id); Item.className=”over”; HideAll(parent,1); } function I_OnMouseOut(id) { var Item; Item = eval(“I_” id); Item.className=”out”; } function I_OnMouseUp(id,parent,location) { var ParentMenu; window.event.cancelBubble=true; OnClick(); ParentMenu = eval(“E_” parent); ParentMenu.display=”none”; if(location == null) eval(“Do_” id “()”); else window.open(location); } function P_OnMouseOver(id,parent) { var Item; var Extend; var Parent; if(parent != “rbpm”) { var ParentItem; ParentItem = eval(“P_” parent); ParentItem.className=”over”; } HideAll(parent,1); Item = eval(“P_” id); Extend = eval(“E_” id); Parent = eval(“E_” parent); Item.className=”over”; Extend.style.display=”block”; Extend.style.posLeft=document.body.scrollLeft Parent.offsetLeft Parent.offsetWidth-4; if(Extend.style.posLeft Extend.offsetWidth > document.body.scrollLeft document.body.clientWidth) Extend.style.posLeft=Extend.style.posLeft-Parent.offsetWidth-Extend.offsetWidth 8; if(Extend.style.posLeft < 0) Extend.style.posLeft=document.body.scrollLeft Parent.offsetLeft Parent.offsetWidth; Extend.style.posTop=Parent.offsetTop Item.offsetTop 1; if(Extend.style.posTop Extend.offsetHeight > document.body.scrollTop document.body.clientHeight) Extend.style.posTop=document.body.scrollTop document.body.clientHeight-Extend.offsetHeight; if(Extend.style.posTop < 0) Extend.style.posTop=0; } function P_OnMouseOut(id,parent) { } function HideAll(id,flag) { var Area; var Temp; var i; if(!flag) { Temp = eval("E_" id); Temp.style.display="none"; } Area = eval("A_" id); if(Area.length) { for(i=0; i < Area.length; i ) { HideAll(Area[i],0); Temp = eval("E_" Area[i]); Temp.style.display="none"; Temp = eval("P_" Area[i]); Temp.className="out"; } } } document.onmouseup=OnMouseUp; document.onclick=OnClick; function OnMouseUp() { if(window.event.button == 2) { var PopMenu; PopMenu = eval("E_rbpm"); HideAll("rbpm",0); PopMenu.style.display="block"; PopMenu.style.posLeft=document.body.scrollLeft window.event.clientX; PopMenu.style.posTop=document.body.scrollTop window.event.clientY; if(PopMenu.style.posLeft PopMenu.offsetWidth > document.body.scrollLeft document.body.clientWidth) PopMenu.style.posLeft=document.body.scrollLeft document.body.clientWidth-PopMenu.offsetWidth; if(PopMenu.style.posLeft < 0) PopMenu.style.posLeft=0; if(PopMenu.style.posTop PopMenu.offsetHeight > document.body.scrollTop document.body.clientHeight) PopMenu.style.posTop=document.body.scrollTop document.body.clientHeight-PopMenu.offsetHeight; if(PopMenu.style.posTop < 0) PopMenu.style.posTop=0; } } function OnClick() { HideAll("rbpm",0); } // Add Your Function on following function Do_viewcode(){window.location="view-source:" window.location.href;} function Do_help(){window.showHelp(window.location);} function Do_exit() {window.close();} function Do_refresh() {window.location.reload();} function Do_back() {history.back();} function Do_forward() {history.forward();} function Do_help(){ var s_help=' <style>body,td{font:menu;padding:2}</style> '; s_help =''; s_help ='<body bgcolor=menu>'; s_help =' 　　欢迎光临无忧视窗！本系统和您的Windows系统操作很相似。单击开始，打开开始菜单，双击桌面图标打开相关文件！本机帮助..'; showModalDialog("about:" s_help "","","dialogHeight:110px;dialogWidth:210px;help:yes;status:no")} --> </SCRIPT> <META content="MSHTML 5.00.2920.0" name=GENERATOR></HEAD> <BODY bgColor=#336699 oncontextmenu=window.event.returnValue=false> <DIV id=snwcwt> 请点击右键</DIV> <SCRIPT language=JScript>  </SCRIPT> </TD></TR></TABLE></BODY></HTML> <a href="http://www.20blog.cn/Dev/HTML/jsrun/">欢迎访问乱舞春秋网页特效集</a>

八 30th, 2009三级下拉菜单-菜单导航特效(0)

欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效：

<SCRIPT LANGUAGE="JavaScript"> “); document.writeln(“<\/script>“); document.writeln(“<script language=\"JavaScript\">"); document.writeln(""); document.writeln("<\/script>"); } //--> </script> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> <FORM name="HwForm"> <HR>选择一次 <SCRIPT LANGUAGE="JavaScript"> CreateSelect(“”,”S_13|S_23|S_33″,”",”请选择地区@|请选择省份@|请选择城市@”,AllStr1,0); </SCRIPT> <HR>选择三次 <SCRIPT LANGUAGE="JavaScript"> CreateSelect(“HwForm”,”S_1|S_2|S_3″,”华北地区|河北|唐山”,”请选择地区@|请选择省份@|请选择城市@”,AllStr1,3); </SCRIPT> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> <HR>选择二次 <SCRIPT LANGUAGE="JavaScript"> CreateSelect(“HwForm”,”S_11|S_21|S_31″,”笔记本|IBM|T42″,”请选择分类@|请选择品牌@|请选择系列@”,AllStr2,2); </SCRIPT> <HR>选择二次 <SCRIPT LANGUAGE="JavaScript"> CreateSelect(“HwForm”,”S_12|S_22|S_32″,”",”请选择分类@|请选择品牌@|请选择系列@”,AllStr2,1); </SCRIPT> </FORM> <a href="http://www.20blog.cn/Dev/HTML/jsrun/">欢迎访问乱舞春秋网页特效集</a>

八 30th, 2009windows XP左侧的菜单效果-菜单导航特效(0)

欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效：

 <style type="text/css"> .mainDiv { width:160px; } .topItem { width:160px; height:22px; cursor:pointer; background: #467BF2; text-decoration: none; color: white; font-weight:bold; font-family:"GOTHIC"; } .dropMenu { background:#D9D9D9; border-top:1px solid #467BF2; border-left:1px solid #92B1F8; border-right:1px solid #92B1F8; border-bottom:1px solid #92B1F8; } .subMenu { display:none; } .subItem { padding-left:5px; cursor:pointer; font-weight:bold; text-decoration:none; color:black; } .subItem a { text-decoration:none; color:black; } .subItemOver { cursor:pointer; color:blue; text-decoration:underline; font-weight:bold; padding-left:5px; } .subItemOver a { color:blue; } .drop { border-left:1px solid black; border-right:1px solid black; } </style> <script language="javascript"> var TIMER_SLIDE = null; var OBJ_SLIDE; var OBJ_VIEW; var PIX_SLIDE = 10; //this is the amount of slide/DELAY_SLIDE var NEW_PIX_VAL; var DELAY_SLIDE = 30; //this is the time between each call to slide var DIV_HEIGHT = 22; //value irrelevant var SUB_MENU_NUM =0; var RE_INIT_OBJ = null; var bMenu = document.getElementById("curMenu"); var MainDiv,SubDiv //DD added code document.write(' <div id="tempcontainer" class="mainDiv" style="visibility: hidden; position: absolute"></div> ') function Init(objDiv) { if (TIMER_SLIDE == null) { SUB_MENU_NUM = 0; MainDiv = objDiv.parentNode; SubDiv = MainDiv.getElementsByTagName("DIV").item(0); SubDiv.onclick = SetSlide; OBJ_SLIDE = MainDiv.getElementsByTagName("DIV").item(1) OBJ_VIEW = OBJ_SLIDE.getElementsByTagName("DIV").item(0); document.getElementById("tempcontainer").innerHTML=MainDiv.getElementsByTagName("DIV").item(2).innerHTML //DD added code DIV_HEIGHT=document.getElementById("tempcontainer").offsetHeight //DD added code for (i=0;i<OBJ_VIEW.childNodes.length;i ) { if (OBJ_VIEW.childNodes.item(i).tagName == "SPAN") { SUB_MENU_NUM ; OBJ_VIEW.childNodes.item(i).onmouseover= ChangeStyle; OBJ_VIEW.childNodes.item(i).onmouseout= ChangeStyle; } } NEW_PIX_VAL = parseInt(MainDiv.getAttribute("state")); } } function SetSlide() { if (window.TIMER_SLIDE) clearInterval(TIMER_SLIDE) //DD added code if (TIMER_SLIDE == null </div>   <div class="post f"> <h2>八 30th, 2009<a href="http://www.20blog.cn/2009/08/174.html">二级下拉菜单-菜单导航特效</a><a href="http://www.20blog.cn/2009/08/174.html#respond" title="二级下拉菜单-菜单导航特效上的评论">(0)</a></h2> <li><a class="gr" href="http://www.20blog.cn/down/code/">乱舞春秋下载中心 – 最新优秀源码下载</a></li> 欢迎光临乱舞春秋网页脚本特效中心，点击运行按钮演示特效： <TEXTAREA id="temp99471" class="htmlarea"><script language="JavaScript">  </script> <a href="http://www.20blog.cn/Dev/HTML/jsrun/">欢迎访问乱舞春秋网页特效集</a>