высота переключения без потери высоты в jQuery

Question

У меня есть вложенный div. Когда пользователь нажимает над родительским div, дочерний div становится видимым. на мыши, ребенок div возвращается к невидимому.

Проблема, с которой я столкнулся, заключалась в том, что если бы я быстро навел указатель мыши на родительский div, скажите 5 раз, эффект слайда будет воспроизведен 5 раз, и мне придется подождать, пока он закончит анимацию.

Итак, я добавил .Stop() перед тем slideDown(), но теперь, если я разнюхивать ДО ребенок ДИВ достигает полной высоты, что текущая высота становится это новая высота. поэтому в следующий раз, когда я нахожусь над ним, я вижу его частично (или вообще ничего, в зависимости от того, когда я удалил мышь на родительский div)

Как решить эту проблему?

Я быстро поиздевались вверх demo on JsFiddle

спасибо.

Answer 1

Вы должны изменить свой код, чтобы выглядеть следующим образом:

$('div#div2', this).not(":animated").slideDown(); 

.not («: анимированный») покажет Jquery только выбрать элементы (в наборе соответствия), которые в настоящее время не анимированные. это гарантирует, что ваш элемент не будет двойной анимацией.

В отличие от .stop() этот не оставит вашу анимацию неполной, поэтому проблема с высотой исправлена ​​таким образом.

jsFiddle: http://jsfiddle.net/YrRe4/1/

Answer 2

Вы также можете определить логические параметры для .stop(), чтобы иметь оба истинны. .stop (true, true). Он закончит очередь и прыгнет в конце анимации.