Помогите с jQuery show/hide

07 апреля 2022, 21:00

Пытаюсь сделать что бы при наведении на блок показывалась картинка внутри него, таких блоков много, у меня при наведении на 1 блок картинки появляются во всех. Я так понимаю нужно сделать как то через this но у меня не получается

$(document).ready(function() {
    $(".card").mouseenter(function () {
        $(".hover").show();
    });
    $(".card").mouseleave(function () {
        $(".hover").hide();
    });
});

Answer 1

    $('.hover').hide(); 
 
    $(document).ready(function() { 
        $(".card").mouseenter(function () { 
            $(this).children('.hover').show(); 
        }); 
 
        $(".card").mouseleave(function () { 
            $(this).children('.hover').hide(); 
        }); 
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<div class="card">Пурум 
    <div class="hover">Пум Пум </div></div> 
<div class="card">Пурум 
    <div class="hover">Пум Пум </div></div> 
<div class="card">Пурум 
    <div class="hover">Пум Пум </div></div> 
<div class="card">Пурум 
    <div class="hover">Пум Пум </div></div>