Tip: you can modify some code before running
<!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">Select ▲<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>
Tip: you can modify some code before running
