求指导，关于iframe和div的onmouseover事件

Question

先上代码：
<div class="menu">
   <div>菜单一
     <iframe scrolling="no" frameborder="0"></iframe>
     <div id="L1" onmouseover="getcss()" onmouseout="outcss()">选项1</div>
     <div id="L1" onmouseover="getcss()" onmouseout="outcss()"> 选项1</div>
     <div id="L1" onmouseover="getcss()" onmouseout="outcss()">选项1</div>
     <div id="L1" onmouseover="getcss()" onmouseout="outcss()">选项1</div>
     <div id="L1" onmouseover="getcss()" onmouseout="outcss()">选项1</div>
   </div>
</div>js:
var id_s;
function onmouseover(){
 var id=window.event.srcElement.id;
 id_s=document.getElementById(id).style;
 id_s.color="#f00";
}
function onmouseout(){
 id_s.color="";
 }代码大致如上，因为页面上有大量grid控件，grid的优先级太高，无论div的z-index设置多少都无法遮盖grid，于是想到使用iframe放在菜单底层。虽然解决了div的菜单不被grid遮挡，但iframe却影响了 onmouseover的鼠标事件无法被触发。请问有什么办法解决？至今不明白放在div底层的iframe为什么为使div的onmouseover事件无法触发。

Answer 1

li的ID一样了，而且事件名称都不对吧，getcss/outcss != onmouseover/onmouseout<div class="menu">
  <div>菜单一
  <iframe scrolling="no" frameborder="0"></iframe>
  <div id="L1" onmouseover="getcss(this)" onmouseout="outcss(this)">选项1</div>
  <div id="L1" onmouseover="getcss(this)" onmouseout="outcss(this)"> 选项1</div>
  <div id="L1" onmouseover="getcss(this)" onmouseout="outcss(this)">选项1</div>
  <div id="L1" onmouseover="getcss(this)" onmouseout="outcss(this)">选项1</div>
  <div id="L1" onmouseover="getcss(this)" onmouseout="outcss(this)">选项1</div>
  </div>
</div><script>
    var id_s;
    function getcss(o) {
        o.style.color = "#f00";
    }
    function outcss(o) {
        o.style.color = "";
    }
</script>

Answer 2

我现在碰到这样问题：导航菜单，移上就会弹出层，我在层里嵌套了个iframe,可鼠标移到iframe弹出层就消失了，这个情况只在ie中啊，怎么解决啊