Форум сайта MyRusakov.ru

Добрый день! Помогите решить проблему. У меня есть список

<ul>
<li class="roditel">
<h3>Меню 1</h3>
<div class="block">
<ul>
<li><a href="#">Подменю 1</a></li>
<li><a href="#">Подменю 2</a></li>
</ul>
</div>
</li>
</ul>

Нужно сделать плавное появление и скрытие блока div, для этого я использую hide() и show()

$(document).ready(function() {
$(".roditel".mouseover(function() {
$(".block".show(1000);
}).mouseout(function() {
$(".block".hide(1000);
});
});

Все получается, блоки скрываются и появляются плавно, НО, когда я навожу на сам блок что бы нажать на ссылку начинается каша. Блок начинает то появляться то исчезать по несколько раз пока я не перезагружу страницу.

Подскажите как это исправить?! За ранее спасибо!!!

Наверное, то что вы хотели.

$(document).ready(function() {
$(".roditel".mouseover(function() {
$(".block".slideDown(1000);
}).click(function() {
$(".block".hide(1000);
});
});