Открытие блока при наведении на кнопку?

Question

[greenzlat]

Задача такая. Есть меню. И есть отдельный блок в HTML разметке стоит после самого меню.

<ul class="menu">
	<li class="show_catalog">Показать каталог</li>
	<li>Пункт2</li>
	<li>Пункт3</li>
	<li>Пункт4</li>
	<li>Пункт5</li>
</ul>
<div id="subcatalog">
	тут сам каталог....
</div>

<script type="text/javascript">
  $('.show_catalog').on('mouseover', function() {
  $("#subcatalog").addClass("hovered");
});

$(document).on('mouseover', function(e) {
  if (!$('.show_catalog').is(e.target) && !$('#subcatalog').is(e.target)) { // если наводим не на .show_catalog и не на .menudop
    $("#subcatalog").removeClass("hovered"); // скрываем блок
  }
});

</script>

Задача такая при наведении на пункт Показать каталог - открывается блок с каталогом. Как только мышку убираем с пункта Показать каталог - сам каталог скрывается.
- этот момент сделал, тут вопросов нет. При наведении навешиваем класс и дальше CSS.
Проблема с другим, когда каталог появляется - при перемещении мышки в область этого каталога - он скрывается. Хотя по скрипту вроде как не должен скрываться.
Нужно чтобы при открытии каталога - можно было мышкой по нему перемещаться и переходить по ссылкам.

Answer 1

[Николай Чуприк]

$("*:not(.show_catalog, #subcatalog)").on('mouseover' {
    $("#subcatalog").removeClass("hovered");
  } )

Конструкция $(document).on('mouseover' ... это вообще какая-то ерунда. Её быть не должно. Наверное подразумевалось $("*").on('mouseover' .... В таком случае дальше лучше не проверять e.target, а сразу же в селекторах это сделать, как собственно я показал выше.

Answer 2

[greenzlat]

Сделал вот так - теперь class hovered вообще не присваивается даже при наведении на показать каталог

$('.show_catalog').on('mouseover', function() {
    $("#subcatalog").addClass("hovered");
  });
  $("*:not(.show_catalog, #subcatalog)").on('mouseover' {
    $("#subcatalog").removeClass("hovered");
  } );