Показать сообщение отдельно
  #16 (permalink)  
Старый 31.05.2017, 17:05
Интересующийся
Отправить личное сообщение для mcreature Посмотреть профиль Найти все сообщения от mcreature
 
Регистрация: 24.05.2014
Сообщений: 12

Сообщение от j0hnik
все работает как часы =)
Как я написал в вопросе, проблема в том, что внутри mini-basket есть еще элементы. mouseenter по идее не должен их учитывать, а он их учитывает и если попадает на внутренний элемент, срабатывает mouseleave.

Ребята, извиняюсь, думал проблема в mouseleave, а проблема оказалась в другом.

Может тогда кто знает, возможно ли сделать так, т.к. мне кажется, что невозможно:
Есть элемент, при наведении на него должен появиться выпадающий блок и layer под ним.
И, соответственно, когда уводишь мышь с этого элемента layer и блок должны исчезнуть.
Собственно проблема в layer, как только он появляется hover и mouseenter спадают.

<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta charset="utf-8">
</head>
<body>
    <div id="site">
        <header id="header">
            <div class="mini-basket" style="width: 100px; height: 100px; border: 1px solid grey;"></div>
        </header>
    </div>
    <div class="layer" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-color: rgba(0,0,0,0.2); visibility: hidden;"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $('.mini-basket').on('mouseenter',function() {
        $('.layer').css('visibility', 'visible');
    });
    $('.mini-basket').on('mouseleave',function() {
        $('.layer').css('visibility', 'hidden');
    });
</script>
</body>
</html>

Последний раз редактировалось ksa, 31.05.2017 в 17:50. Причина: Сделал запуск скрипта...
Ответить с цитированием