关于层+下拉框的问题

<!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" />
<title></title>
<script language="JavaScript">
<!--
var hasFocus = false;
function over(){
var trObj=document.getElementById("divC1"); 
trObj.style.display="";
}
function out(){
var trObj=document.getElementById("divC1");
if (!hasFocus){
trObj.style.display="none";
}
}
function show(){
var trObj=document.getElementById("divC1");
trObj.onmouseout="";
}
function setFocus(){
hasFocus = true;
}
function disetFocus(){
hasFocus = false;
}
//-->
</script>
</head><body>
<table width="260" border="0" cellspacing="0" cellpadding="0" style="border:2px groove #FFFFFF;">
  <tr>
    <td height="6" bgcolor="#CCCCCC" onmouseover="over();"></td>
  </tr>
</table>
<div id="divC1" style="width:260px; height:35px; overflow-x:hidden; overflow:auto; position:absolute; top: 15px;display:none;" onmouseout="out();">
<table bgcolor="#CCCCCC" width="100%" border="0" cellpadding="0" cellspacing="0" style="width:260px;height:30px;border:2px groove #FFFFFF;">
           <tr>
             <td width="60" height="30" align="right">方式</td>
     <td width="90"><select name="select" onfocus="setFocus();" onblur="disetFocus();">
                 <option value="0">正常</option>
                 <option value="1">填充</option>
                 <option value="2">智能</option>
               </select>
             </td>
             <td width="40" align="right">分屏</td>
             <td><select name="select2">
                 <option>1</option>
                 <option>2</option>
                 <option>3</option>
                 <option>4</option>
                 <option>5</option>
                 <option>6</option>
               </select>
             </td>
           </tr>
  </table>
</div>
</body>
</html>