Как с помощью jQuery задать стили одному элементу при наведении на другой элемент?

Question

[weranda]

Приветствую

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

Answer 1

[Сергей Горячев]

https://jsfiddle.net/webirus/k0nay43f/3/
JS там не нужен. position + z-index верные выставить просто надо.
Желтым выделил, чтобы показать, какое должно быть меню.

https://jsfiddle.net/webirus/k0nay43f/4/
Тут вариант с плавным появлением, если оно нужно.

https://jsfiddle.net/webirus/k0nay43f/5/
Ну и последний вариант, ковёр на всю страницу.

Answer 2

[creatoroftheworld]

Братан, просто в .menu { допиши position: relative

Answer 3

[iBird Rose]

потому что ты при display: block; перекрываешь блок на который ты сделал hover. и следовательно срабатывает твой .mouseleave, и так по кругу. не перекрывай блок на который делаешь hover в общем.

https://jsfiddle.net/k0nay43f/1/

Comments

[weranda]

В том-то и дело, что заполняться должно все окно, а меню быть поверх заливки.