Div OnMouseOver IE problem

[contact]

Проблема слудующая

Есть оснвной див, при наведении на него отображаються 2 дополнительных дива(слева и снизу) аля доп меню.

	<div id="layer1" onmouseover ="showhidemenu(1);" onmouseout ="showhidemenu(1);">DIV 1</div> <!-- основной-->

	<div id="layer11" onmouseover ="showhidemenu(1);" onmouseout ="showhidemenu(1);" >DIV 1 right</div>  <!-- дополнительный 1-->
 	<div id="layer12" onmouseover ="showhidemenu(1);" onmouseout ="showhidemenu(1);" >DIV 1 bottom</div>   <!-- дополнительный 2-->

Наводишь на основной - отобразились дополнитеьные, уводишь мышь на любой дополнительный - они продолжают отображаться. Уводишь на любую другую область - скрываються.

Проблема в том, что в IE дополнительные дивы скрываться даже если указатель переходит с основного на дополнительный. в ФФ и хороме все ок.

Джаваскрипт следующий

 <script language="javascript">
  function showhidemenu(id) {
	  var divright = document.getElementById('layer' +id+'1');
	  var divbottom = document.getElementById('layer' +id+'2');
	  if(divright.style.display == 'block') {
		  divright.style.display = 'none';
		  divbottom.style.display = 'none';
	  } 
	  else {
		  divright.style.display = 'block';
		  divbottom.style.display = 'block';
	  }
  }
  </script>

Необходимо сделать, что бы дивы отображались при переводе указателя с основного на дополнительный для IE.

[CEBEP]

видимо ваши дивы свёрстаны так что в IE между layer1 и layer12/layer11 есть отступ, другой элемент или что-либо ещё. Это приводит к срабатыванию выключения появившихся дивов (сработало onMouseOut), а в фф такого нет потому что нет и разрывов.

+ рекомендую переписать скрипты

<script language="javascript">
  function displayElems()
{
	  document.getElementById('layer11').style.display = 'block';
	  document.getElementById('layer12').style.display = 'block';
}
  function hideElems()
{
	  document.getElementById('layer11').style.display = 'none';
	  document.getElementById('layer12').style.display = 'none';
}
  </script>

И соответственно

	<div id="layer1" onmouseover ="displayElems()" onmouseout ="hideElems()">DIV 1</div> <!-- основной-->

	<div id="layer11" onmouseout ="hideElems()">DIV 1 right</div>  <!-- дополнительный 1-->
	<div id="layer12" onmouseout ="hideElems()">DIV 1 bottom</div>   <!-- дополнительный 2-->

[eyexal]

в таких менюшках нужно использовать setTimeout при mouseout с задержкой примерно в 200 мс, а при mouseover надо сбрасывать этот таймер clearTimeout(имя таймера), это дает нам задержку в 200 мс до того как спрячется меню, мы успеваем навести мышку на подменюшку и таймер не срабатывает не успев выполнить функцию спрятания менюшек.

[contact]

Cпасибо за помощь. eyexal спсасибо учту.

Вопрос решился. трабла была том, что дополнительные дивы у меня полупрозрачные. А так как ИЕ не поддерживает

rgba(24,104,33,0.65)

такую прозрачность, пришлось для него делать:

{
background: transparent;
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#A5186821,endColorstr=#A5186821)"; /* IE8 */	
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#A5186821,endColorstr=#A5186821);   /* IE6 & 7 */	  
zoom: 1;
}

Это и привело к тому, что OnMouseOver отказывалось работать при наведении на такой див. Сейчас заменил принцип полупрозрачности и сделал 1х1 пикс. полупрозрачный пнг и все стало ок.