Как не сворачивать меню если уводить курсор в сторону?

Question

[Андрей]

Добрый день!
Сделал на сайте меню по типу как на сайте - https://allo.ua/ru/
примерно тоже такое - http://prntscr.com/qwp6mu
Но я не могу сделать что бы когда уводишь курсор в сторону, примерно по оси z, меню не закрывалось, как сделано на этом же allo - http://prntscr.com/qwp7hd То есть стрелка - это курсор и когда введешь в сторону на под меню, то оно не закрывается.
Я пока не понимаю как это можно реализовать, может кто-то сталкивался?

Comments

[Somewhere Intech]

Ось z в этом контексте понимается как глубина, т.е. вы говорите что вдавливаете и выдавливание мышь в экран

[Андрей]

Johnny Lowhunter , я ничего не говорю, я примерно привел пример, поскольку не знаю как решить это

Answer 1

[Андрей]

Вообщем проблему решил сам, наверное я вопрос не правильно тут поставил.
Ну тем не менее примерно свою проблему решил по этой статье -

https://getinstance.info/articles/css/dropdown-menus-with-more-forgiving-mouse-movement-paths/

Answer 2

[Владимир Коротенко]

Так не сворачивайте его.
Там довольно большой контейнер в котором отображается меню, соответственно пока мышка не выходит за его пределы контейнер отображается. Как это сделать?
Я бы навешивал на ховер обработчик и на весь контейнер скрытие.

Answer 3

[Mak_Pet]

Код дайте, обычно все работает с помощью

.sub-menu {
    display: none;
}
.menu-item:hover > .sub-menu {
    display: xxx;
}