<ptml> <pead> <meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "> <title> Please select Abcdefghi_select Horizontal effect _ Cloud Habitat </title> </pead> <body> <style > *{font-size:12px;} a.s_l {BORDER: #dddddd 1px solid; Border-right: #dddddd 0px solid; BACKGROUND: #ffffff; padding:4px 6px 2px 6px; TEXT-DECORATION:NONE;LINE-HEIGHT:12PX} a.s_l:hover {BORDER: #003366 1px solid; Border-right: #dddddd 0px solid; BACKGROUND: #0063dc; COLOR: #ffffff; TEXT-DECORATION:NONE;LINE-HEIGHT:12PX} a.s_r {BORDER: #dddddd 1px solid; BACKGROUND: #ffffff; padding:4px 6px 2px 6px; TEXT-DECORATION:NONE;LINE-HEIGHT:12PX} a.s_r:hover {BORDER: #003366 1px solid; BACKGROUND: #0063dc; COLOR: #ffffff; TEXT-DECORATION:NONE;LINE-HEIGHT:12PX} input {BORDER: #aaa 1px solid;width:65px;height:23px; padding:4px 6px 0px 6px;background:url (http://bbs.blueidea.com/attachment.php?aid=90338&noupdate=yes) No-repeat Center; . span1 {Position:relative;top:3px;} . span2 {position:relative;left:-3px;top:1px} </style> <span class= "span1" ><input type= "text" value= "please Select "Onclick=" Sele (this) ></span> <span class= "span2" id= "select" >ABCDEFGHI</span> <script > Function Sele (o) {var Oobj=document.getelementbyid ("select") if (oobj.style.display== "None") {OOB J.style.display= "" Var obj=oobj.getelementsbytagname ("a"), J=obj.length for (Var i=0;i<j;i++) { Obj[i].onclick=function () {o.value=this.innerhtml; Oobj.style.display= ' None '}} else oobj.style.display= ' None '} </script> </b Ody> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]