Search code examples
jqueryhoverfadeto

jquery hover propagation

I'm using this on an hover image :

$('.img-style').hover (function(e) {
    var prixPlus = $(this).closest('a').attr('data-prix'); 
    prixPlus = parseFloat(prixPlus);
    var prixNew = prix + prixPlus;

    $('#chgePrix').html(prixNew.toFixed(2));
    $('#txtapart').fadeTo('fast', 0.1);
}, function(e) {
    $('#chgePrix').html(prix.toFixed(2));
    $('#txtapart').fadeTo('fast', 1);
});

But if I pass quickly the mouse 2 or more times over the image, $('#txtapart') fade in and out 2 or more times ! How can I stop the fade propagation ?

Thanks for your help...

Solution

  • Use stop() method

     $('#txtapart').stop(true,true).fadeTo('fast', 0.1);

    This forces prior animation to end. The two true arguments clear the queue and set animation at it's end point so that the new animation can start immediately when other event is trigegred.

    http://api.jquery.com/stop/