Hover эффект на блок
Я знаю, что в моём коде ошибка, но я не могу её найти. Как можно сделать, чтобы "1" выводил один раз, когда мы навели на .wrapper ? И когда убирали курсор с блока в консоль выводилось только одни раз "2"
code : click
$('body').on('mousemove', function() {
if($('.wrapper').is(':hover')) {
console.log('1')
} else {
console.log('2')
}
});
Ответы (1 шт):
Автор решения: Rudi
→ Ссылка
У тебя слушатель стоит на mousemove т.е. при движении мыши многократно срабатывает скрипт. Попробуй слушатель on mouseenter и on mouseleave
UPD: добавил вариант с hover
$(".wrapper").on({
mouseenter: function () {
console.log(1)
},
mouseleave: function () {
console.log(2)
}
});
// И второй вариант с hover
//$( ".wrapper" ).hover( handlerIn, handlerOut )
//function handlerIn(){
//console.log(1)
//}
//function handlerOut(){
//console.log(2)
//}
.wrapper{
width 100px;
height:80px;
background:red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='wrapper'></div>