js+css仿下拉菜单效果

作者:sky 点击:167 评论:0 发布时间:周日, 06/28/2009 - 06:31 所属分类:表单按钮

通过js+css设计一个下拉菜单，带关闭功能。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <meta name="keywords" content="站长,网页特效,js特效,js脚本,脚本,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效网" /> <meta name="description" content="www.zzjs.net,站长特效网，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在站长特效网" /> <title>网页特效 JS+CSS仿下拉列表框效果站长特效网</title> <style type="text/css">  </style> <script type="text/javascript"> function gets_id(objName){ if(document.getElementById){ return eval('document.getElementById("' + objName + '")'); }else if(document.layers){ return eval("document.layers['" + objName +"']"); }else{ return eval('document.all.' + objName); } }//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是 js特效，本站收集大量高质量js代码，还有许多广告代码下载。 //打开DIV层 function disp_cc() { if(gets_id('hh').style.display=='none') { gets_id('hh').style.display=''; } else { gets_id('hh').style.display='none'; } }//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。 //赋值 function gets_value(str) { gets_id('class').value=str; gets_id('hh').style.display='none'; }//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。 </script> </head> <body> <a href="http://www.zzjs.net/">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net，站长js特效。<hr>  <script type="text/javascript" src="http://www.zzjs.net/ad/tc.js"></script> <div class="xmkc"> <div><input name="class" type="text" class="zzjs_net" onClick="disp_cc();" value="请选择类别"> </div> <div id="hh" style="display:none" class="classlist"> <ul>  <li class="lis"><a href="#" onClick="gets_value('ASP')">ASP</a></li> <li class="lis"><a href="#" onClick="gets_value('PHP')">PHP</a></li> <li class="lis"><a href="#" onClick="gets_value('JSP')">JSP</a></li> </ul> <span onclick="hh.style.display='none'" class="close"><a href="#">关闭</a></span> </div> </div> </body> </html>

提示：你可以先修改部分代码再运行。

顶一下

(0)

踩一下

(2)

100%

标签: