📄 0152.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><!-- saved from url=(0032)http://www.ie-zone.com/index.php --><HTML><HEAD><TITLE>可带有图片的下拉选择</TITLE><META http-equiv=Content-Type content="text/html; charset=gb2312"><LINK href="../../fav.ico" rel="shortcut icon"><STYLE type=text/css>BODY { MARGIN: 25px 25px 25px}#all TD { FONT-SIZE: 14px; LINE-HEIGHT: 18px; FONT-FAMILY: "宋体"}INPUT { FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"}SELECT { FONT-SIZE: 14px; LINE-HEIGHT: 18px; FONT-FAMILY: "宋体"}TEXTAREA { FONT-SIZE: 14px; LINE-HEIGHT: 18px; FONT-FAMILY: "宋体"}#all A:active { COLOR: #7d070c}#all A:visited { COLOR: #7d070c}#all A:hover { COLOR: #336699}#all A:link { COLOR: #7d070c}</STYLE><SCRIPT language=JavaScript><!--function MM_goToURL() { //v3.0 var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");}function JM_cc(ob){var obj=MM_findObj(ob); if (obj) { obj.select();js=obj.createTextRange();js.execCommand("Copy");}}function MM_findObj(n, d) { //v4.0 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && document.getElementById) x=document.getElementById(n); return x;}//--></SCRIPT><META content="MSHTML 5.50.4134.600" name=GENERATOR><link type="text/css" rel="STYLESHEET" href="js/classic.css"></HEAD><BODY id=all text=#000000 bgColor=#336699><TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TR bgColor=#ffffff> <TD><IMG src="../images/sq_1.gif" width=11 height="14"></TD> <TD width="100%"></TD> <TD><IMG src="../images/sq_2.gif" width=11 height="14"></TD> </TR></TABLE><TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TR bgColor=#ffffff> <TD><IMG src="../../images/space.gif" width=11 height="1"></TD> <TD width="100%"> <table width="100%" border="0" cellpadding="8"> <tr> <td align="center"> <script language="JavaScript">document.write("<font color=#7d070c style=\"font-size: 14px\">"+document.title+"</font>");</script> </td> </tr> <tr> <td bgcolor="#f7f7f7"><font color="#990000"> 提示</font>:一个来自WebFx的脚本,把传统的下拉菜单修改的很Cool,在options选择内可以加入图片,显示提示信息等,比传统的下拉选择菜单漂亮多了!<br> <script type="text/javascript" src="js/fade.js"></script> <script type="text/javascript" src="js/select.js"></script> <script type="text/javascript" src="js/writeSelect.js"></script> <script language="">topArray = new Array();topArray[0] = new Option('<nobr title="访问无忧脚本主页"><img src="img/home.gif" width=16 height=17 border=0 align="absmiddle"> <span style="font-family: arial black; font-style: italic; font-weight: bold;">51JS.COM</span> Home</nobr>', "http://www.51js.com");topArray[1] = new Option('<nobr title="JavaScript实例宝库"><img src="img/htmlicon.gif" width=16 height=16 border=0 align="absmiddle"> 脚本实例宝库</nobr>', "http://www.51js.com/js.php");topArray[2] = new Option('<nobr><img src="img/htmlicon.gif" width=16 height=16 border=0 align="absmiddle"> 提示资料库</nobr>', "http://www.51js.com/article.php");writeSelectBox(topArray, "select2", 1, "window.open(this.options[this.selectedIndex].value, '_blank')", "margin-left: 10; width: 150;");</script> </td> </tr> <tr> <td><img src="imgs/step.gif" width="30" height="30"> <b>将下面的代码复制到<head> 内并把相应的脚本文件与CSS文件放到相应的目录下</b><br> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#dddddd"> <tr> <td></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#f7f7f7"><form name="form1" method="post" action=""> <tr> <td><link type="text/css" rel="STYLESHEET" href="<a href="js/classic.css" target="_blank">classic.css</a>"><br> <script type="text/javascript" src="<a href="js/fade.js" target="_blank">fade.js</a>"></script><br> <script type="text/javascript" src="<a href="js/select.js" target="_blank">select.js</a>"></script><br> <script type="text/javascript" src="<a href="js/writeSelect.js">writeSelect.js</a>"></script></td> </tr> </form> </table> <br> <br> <img src="imgs/step2.gif" width="30" height="30"> <b>将下面的代码复制到<body> 内 </b><br> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#dddddd"> <tr> <td></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#f7f7f7"> <tr> <td><script> <p>topArray = new Array();<br> topArray[0] = new Option('<nobr title="访问无忧脚本主页"><img src="img/home.gif" width=16 height=17 border=0 align="absmiddle"> <span style="font-family: arial black; font-style: italic; font-weight: bold;">51JS.COM</span> Home</nobr>', "http://www.51js.com");<br> topArray[1] = new Option('<nobr title="JavaScript实例宝库"><img src="img/htmlicon.gif" width=16 height=16 border=0 align="absmiddle"> 脚本实例宝库</nobr>', "http://www.51js.com/js.php");<br> topArray[2] = new Option('<nobr><img src="img/htmlicon.gif" width=16 height=16 border=0 align="absmiddle"> 提示资料库</nobr>', "http://www.51js.com/article.php");</p> <p>writeSelectBox(topArray, "select2", 1, "window.open(this.options[this.selectedIndex].value, '_blank')", "margin-left: 10; width: 150;");</p> <p></script></p> </td> </tr> </table> <br> <img src="imgs/step3.gif" width="30" height="30"> <b>添加新options</b><br> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#dddddd"> <tr> <td></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#f7f7f7"> <form name="form1" method="post" action=""> <tr> <td><font color="#990000">[代码] </font><br> topArray[3] = new Option('<nobr><img src="img/htmlicon.gif" width=16 height=16 border=0 align="absmiddle"> 显示的代码 </nobr>', "/article.php");<br> <br> <font color="#990000">[解析]</font> <br> topArray[项目号码] new Option('显示的html代码,可以写上你的项目内容','选择的值')</td> </tr> </form> </table> <br> <img src="imgs/step4.gif" width="30" height="30"> <b>显示我的选择</b><br> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#dddddd"> <tr> <td></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="7" bgcolor="#f7f7f7"> <form name="form1" method="post" action=""> <tr> <td><font color="#990000">[代码]</font><br> writeSelectBox(topArray, "select2", 1, "window.open(this.options[this.selectedIndex].value, '_blank')", "margin-left: 10; width: 150;");<br> <br> <font color="#990000">[解析]</font> <br> // topArray:就是你上段定义的项目数组名字 <br> // select2: id号码<br> // 1 :大小<br> // window.open(this.options[this.selectedIndex].value, '_blank') : onChang时触发的操作<br> // margin-left: 10; width: 150 : option的显示风格</td> </tr> </form> </table> <br> </td> </tr> </table> <br> <br> </td> </tr> </table> <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0> <TR bgColor=#ffffff> <TD><IMG src="../images/sq_3.gif" width=11 height="14"></TD> <TD width="100%"></TD> <TD><IMG src="../images/sq_4.gif" width=11 height="14"></TD> </TR></TABLE></BODY></HTML>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -