我想下拉选择时, 让下拉框所在的层不消失,下拉框也不消失,只有当鼠标完全离开了这个层, 才隐藏该层 show1, 该怎么做
      <style type="text/css">
#show1{ background:#FF6699; width:300px; height:300px; padding-left:50px;}
</style>
<script type="text/javascript">
function show(){
    //alert('ss');
    document.getElementById('show1').style.display="";
    
}
function hide(){
    document.getElementById('show1').style.display="none";
}
</script>
<div onmouseover="show();">显示层</div>
<div id="show1" onmouseout="hide();">
   <select>
        <option style="z-index:-5px;">宋体</option>
        <option style="z-index:-5px;">黑体</option>
    </select>
</div>