Моргает меню при переходе

[darl]

Подскажите пожалуйста,уже весь день убил, делаю меню, при наведении на него появляется div блок, а при перемещении на него происходит моргание.
Вот пример
http://jsfiddle.net/ldar/WujwS/1/

<div class="menu">
            <div id='category' class='cathover'> Категории </div> //Кнопка, при наведении на которую, появляется div c id categoryes
            <div id='categoryes' class="cathover"> // Блок спунктами который появляется
                <div class='item'>item1</div>
                 <div class='item'>item2</div>
                 <div class='item'>item3</div>
                 <div class='item'>item4</div>       
            </div>    
</div

$('#categoryes').fadeOut(300); // Делаю блок невидимым
$('.cathover').mouseenter(function(){ 
        $('#categoryes').fadeIn(300); // При наведении указателя на класс cathover, появляется блок '#categoryes
    })
    $('.cathover').mouseleave(function(){
        $('#categoryes').fadeOut(300); // При покидании указателя  класса cathover, исчезает блок '#categoryes
    })

[danik.js]

А можете в своем коде прописать комментарии что делает каждая строчка?

[darl]

А можете в своем коде прописать комментарии что делает каждая строчка?

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

[danik.js]

Ок. Как вариант:

$('#categories').fadeOut(300);
$('.cathover').mouseenter(function(){
    $('#categories').stop().show().animate({opacity: 1}, 300);
})
$('.cathover').mouseleave(function(){
    $('#categories').stop().animate({opacity: 0}, 300, function(){ $(this).hide() });
})

[darl]

$('#categories').fadeOut(300);
$('.cathover').mouseenter(function(){
    $('#categories').stop().show().animate({opacity: 1}, 300);
})
$('.cathover').mouseleave(function(){
    $('#categories').stop().animate({opacity: 0}, 300, function(){ $(this).hide() });
})

не знаю почему, но не работает вообще.
http://jsfiddle.net/ldar/WujwS/2/

[danik.js]

categories

[darl]

И правда...Спасибо большое!!!