JQuery efekti her seferinde bir öğeye nasıl sınırlandırabilirim?

Question

Gezinme efekti olan bir grup divum var, ancak hızlı bir şekilde üzerine getirdiğinizde animasyon dağınık oluyor.

<a> 
    <div class="project"> 
     <img src="img/projects/TrendyPhones.png" alt="project screenshot"> 
     <h3>Trendy Phones</h3> 
    </div> 
</a> 
<a href=""> 
    <div class="project"> 
     <img src="img/projects/TrendyPhones.png" alt="project screenshot"> 
     <h3>Trendy Phones</h3> 
    </div> 
</a> 
<a href=""> 
    <div class="project"> 
     <img src="img/projects/TrendyPhones.png" alt="project screenshot"> 
     <h3>Trendy Phones</h3> 
    </div> 

$(document).ready(function(){ 
    $('.project').hover(function(){ 
     $(this).find('h3').fadeIn(500); 
    }, function(){ 
     $(this).find('h3').fadeOut(500); 
    }); 
}); 

Answer 1

biri yeni başlamadan önce .stop() giden animasyonu deneyin: Bu HTML.

$(document).ready(function(){ 
    $('.project').hover(function(){ 
    $(this).find('h3').stop().fadeIn(500); 
    }, function(){ 
    $(this).find('h3').stop().fadeOut(500); 
    }); 
});