CODEWITHSUNDEEP
htmljquerycsshover
saintyusuf
saintyusuf

Reputation: 504

How to choose hovered one which has same class in jQuery

When I hover on any .card-product div, all .card-product divs affecting. How can I choose only hovered one?

HTML:

<div class="card-product">
      <img class="card-product-img" src="anywhere1">
      <img class="card-product-img2" src="anywhere2">
      <div class="card-product-name">T-Shirt</div>
      <div class="card-product-price">39$</div>
</div>

<div class="card-product">
      <img class="card-product-img" src="anywhere3">
      <img class="card-product-img2" src="anywhere4">
      <div class="card-product-name">Shirt</div>
      <div class="card-product-price">49$</div>
</div>

jQuery:

$(".card-product").mouseover(function() {
    $(".card-product-img").css("display","none");
    $(".card-product-img2").css("display","block");
});

Upvotes: 0

Views: 34

Answers (1)

Hally
Hally

Reputation: 81

for your jQuery, you can do this...

$(".card-product").mouseover(function() {
    $(".card-product-img", this).css("display","none");
    $(".card-product-img2", this).css("display","block");
});

Upvotes: 1

Related Questions