提示：您可以先修改部分代碼再運行
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.111cn.et/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title><style type="text/css">body{ font:12px/20px Arial, Helvetica, sans-serif ,"宋體"; color:#222}ul,dl,dt,dd,form,p,h1,h2,h3,h4,h5,h6,blockquote,pre{margin:0;padding:0}li{list-style:none}/*li,dd{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}*/img{border:0}a{color:#1E5494}a:hover{color:#2674D1}input,select{font-size:12px;font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif}.select{ position:relative; padding:5px 5px 2px 5px; width:52px; background:#F4F4F4;}.select span{ cursor:pointer}#sub_list{ position:absolute; padding:0 2px 2px 0; top:28px; left:0; width:60px; background:#F4F4F4}#sub_list ul{ display:block; padding:5px; border:1px solid #E1E1E1; background:#FFF}#sub_list ul li{ border-bottom:1px solid #E1E1E1;}#sub_list ul li a{ display:block; padding:3px 0 2px 3px; text-decoration:none}#sub_list ul li a:hover{ background:#F4F4F4}.hidden{ display:none}</style></head><body><div class="select"> <span onclick="showSelect(this,'sub_list')">請選擇▲</span> <div id="sub_list" class="hidden" onclick="this.style.display = 'none'"> <ul> <li>1</li> <li>2</li> <li>3</li> </ul> </div></div></body></html><script type="text/javascript">function showSelect(hld,id){ var ele = document.getElementById(id); ele.style.display = 'block'; var timer = null; ele.onmouseover = function(){ if(timer){ clearTimeout(timer); } ele.style.display = 'block'; } ele.onmouseout = function(){ timer = setTimeout(function(){ele.style.display = 'none'},500); } hld.onmouseover = function(){ if(timer){ clearTimeout(timer); } } hld.onmouseout = function(){ timer = setTimeout(function(){ele.style.display = 'none'},500); }}</script>
提示：您可以先修改部分代碼再運行
