Почему скачет меню?

Question

[Mikhail Rerberg]

Всем привет!

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

Код:
https://codepen.io/anon/pen/RJNpbY

Comments

[AngReload]

Не заметил чтобы дергалось.

[Mikhail Rerberg]

AngReload, Если быстро перевести мышь в район первой ссылки - начнет

[AngReload]

Mikhail, Аааа, так между кнопкой и меню есть отступ, когда туда попадает курсор меню теряет наведение и начинает скрытие, при скрытии анимация двигает его вверх под курсор, и оно снова пытается раскрыться и так по кругу.

[Mikhail Rerberg]

AngReload, Спасибо большое! Но еще один вопрос: а если требуется по макету сделать этот отступ, то как миновать скачки?

[AngReload]

Mikhail, ну например сделать отступ не с помощью margin у page-header__drop-list, а с padding у page-header__drop-content и overflow hidden чтобы дочерний элемент за границы родителя не вылезал.
Можно анимацию не jQuery (вообще я не понимаю его), а толковую на css написать.
Там еще я заметил что-то с курсором при наведении на пункты меню, что-то там конфиктует.

[AngReload]

Но вообще не стоит надеяться на мой ответ, что за стили навешивает jQuery я не проверял и с CSS не разбирался, тут мне долго думать надо, а лень.

[Mikhail Rerberg]

AngReload, Я так и сделал, нафиг это все :D

Answer 1

[Дмитрий Федин]

Я бы на твоём месте не использовал JQuery там, где может помочь обычный CSS.

Вот я сделал тоже самое, но только на чистом CSS: https://codepen.io/amidf/pen/zaxwMQ?editors=1100.

Если говорить про дёргания меню, скорей всего это происходит, потому что когда наводишь на кнопку, то срабатывает slideDown функция, а так как она длится определённое время, а курсор уже с кнопки убран, то она выходит ещё не закончилась, а уже срабатывает slideUp функция. В общем, либо проблема в том, что функции slide одновременно срабатывают, либо когда курсор переходит из области, где находится кнопка "Cсылка", в область списка, срабатывают события mouseenter и mouseleave из-за чего они перекрывают друг друга и, следовательно, начинаются дёргания.

Answer 2

[Максим]

you better code lay out !where the looped that the you !