Wie kann ich jQuery foreach für meine Bildunterschriften aktivieren?

Question

Ich habe diese jQuery einige Titel auf ein Bild zu animieren:

$(document).ready(function() { 
    $('.box').mouseenter(function(){ 
      $('.caption').stop().animate({height: "90%"}); 
    }); 

    $('.box').mouseleave(function(){ 
      $('.caption').stop().animate({height: "15%"}, 2500, function() { 
      }); 
    }); 
    }); 

HTML: für nur ein Bild

<div class="box"> 
    <div class="caption"> 
     <h3>One</h3> 
     <p>Under</p> 
    </div> 
    <img src="/i/d.jpg" /> 
</div> 

Arbeiten groß. Ich möchte jedoch, dass es mehr gibt, aber derzeit auf mouseenter alle Beschriftungen zusammen animieren.

Wie kann ich es für jeden einzeln arbeiten lassen?

Answer 1

Verwendung $(this) auf die Elemente in Bezug auf den Fall Bezug zu nehmen:

$('.box').mouseenter(function(){ 
    $(this).find('.caption').stop().animate({height: "90%"}); 
}); 

$('.box').mouseleave(function(){ 
    $(this).find('.caption').stop().animate({height: "15%"}, 2500, function() { 
     }); 
});