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

Подскажите пожалуйста,уже весь день убил, делаю меню, при наведении на него появляется 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
    })

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

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

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

$('#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/

categories

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