Question

您好我有以下html布局

 <div id="stripe_container" style="top: 0px; border: 1px solid rgb(235, 116, 41);  
background: none repeat scroll 0% 0% rgb(243, 232, 151); position: fixed; height: 30px;  
width: 100%; left: 0px; z-index: 99999999; font-size: 14px; font-family: Verdana;   
cursor: pointer;" class="">
  <div id="stripe_rollover" style="height: 30px; background-color: transparent; z-index:  
    99999999; left: 0px; width: 97%; position: fixed;"></div>
   <div id="stripe_text_left" style="margin-top: 5px; margin-left: 15px; color: black;  
    float: left;">Text Test</div>
   <div id="stripe_text_right" style="top: 4px; right: 40px; cursor: pointer; position:  
   absolute; float: right;">Mouseover</div>

下面是我的js代码

  <script>
  var x;
stripe_rollover.onmouseover=function(){
   x=document.createElement('div');
   x.style.height='30px';
   x.style.width='40px';
   x.style.backgroundColor='#000000';
   var stripe_container=document.getElementById('stripe_container');
   stripe_container.parentNode.insertBefore(x,stripe_container.nextSibling);

}

stripe_rollover.onmouseout=function(){
   x.parentNode.removeChild(x); 
}

Iam在IE浏览器中遇到问题。 IE 8,9甚至10.当我将鼠标移到strip div时，会触发mouseover事件，但是当光标移动到 Mouseover 文本时，事件不会被触发。

Answer 1

这将解决您的问题（Example）

function mouseOver_handler(){
    // ...
}

function mouseOut_handler(){
    // ...
}

stripe_rollover.onmouseover = mouseOver_handler;
stripe_text_left.onmouseover = mouseOver_handler
stripe_text_right.onmouseover = mouseOver_handler;

stripe_rollover.onmouseout = mouseOut_handler;
stripe_text_left.onmouseout = mouseOut_handler
stripe_text_right.onmouseout = mouseOut_handler;

鼠标悬停，Mouseout事件未在IE中触发

1 个答案: