Internet Explorer и OnMouseOver/onMouseOut

Question

Я попытался глядя на подобный вопрос здесь, но не смог найти один так что здесь речь идет о:

У меня есть этот HTML (игнорировать «+ все, + @», его в файле отделенного кода так im, поместив некоторые переменные, получаемые оттуда):

<div id='ReferenceContainer"+UniqueID+@"' style='background-color:"+BackcolourOFF+@"; width:"+CompWidth+@"; height:"+CompHeight+@";'> 
    <div id='Reference"+UniqueID+@"' style='width:"+CompWidth+@"; height:"+CompHeight+@"; '> 
     <div id='RefTextContainer"+UniqueID+@"' style='float:left; width:"+CompWidth+@"; height:"+CompHeight+@"; ' > 
      <div id='RefTitleCon' style='margin-top:"+RefTitleMargin+@"px; color:"+RefTitleColor+@"; z-index:-1;' ><p><b>"+RefTitle+@"</b></p> </div> 
      <div id='RefTextCon'><p>"+RefText+@"</p></div> 
     </div> 
     <div id='RefPicContainer"+UniqueID+@"' style='float:right;'> 
      <img id='RefImg"+UniqueID+@"first' class='first' name='RefImg"+UniqueID+@"' src=" + StartImg + @" style='position:absolute;' ></img> 
      <img id='RefImg"+UniqueID+@"second' class='second' name='RefImg"+UniqueID+@"' src=" + AltImg + @" style='display:none;' ></img> 
     </div> 
     </div> 
    <div id='ScriptContainer"+UniqueID+@"' style='width:"+CompWidth+@"; height:"+CompHeight+@"; position:relative; top:-"+CompHeight+@"px; left:0px;' onMouseOver='ChangeBackcolourON"+UniqueID+@"()' onMouseOut='ChangeBackcolourOFF"+UniqueID+@"()'></div> 
</div> 

Теперь в firefox все работает просто отлично. Div «ScriptContainer» находится перед всем, и когда мышь входит или выходит, функции работают точно так, как должны. Но IE8 помещает текст перед всем, а затем функции не работают, как хотелось бы. «ChangeBackcolourOFF» вызывается каждый раз, когда мышь вводит текст, который находится перед всем, и «ChangeBackcolourON» вызывается каждый раз, когда мышь входит в «Scriptcontainer» из текста.

Так что мне нужно выяснить, как заставить текст размещаться за «Scriptcontainer» или некоторые другие решения.

Я ценю вас ответы

Answer 1

Хорошо, я на самом деле понять это методом проб и ошибок. Так что я думал, что поделюсь.

По-видимому, если «Scriptcontainer» не имеет цвета фона, то IE помещает текст спереди, но если «Scriptcontainer» имеет фоновый цвет, то текст помещается позади.

Так что я дал «Scriptcontainer» цвет фона и сделал это с помощью фильтра: alpha (opacity = 0); непрозрачность: 0; так, как это:

<div id='ScriptContainer"+UniqueID+@"' style='width:"+CompWidth+@"; height:"+CompHeight+@"; position:relative; background-color:#ffffff; filter:alpha(opacity = 0); opacity: 0;' onMouseOver='ChangeBackcolourON"+UniqueID+@"()' onMouseOut='ChangeBackcolourOFF"+UniqueID+@"()'> 

Я не уверен, если есть другие, возможно, более эффективные решения этой проблемы, но это, кажется, работает для меня.