Animación Jquery en mouseover y parada en mouseout

tengo seis botones con este código :

$('img#b1').on('mouseenter', function() {
    var height = $('div#b1').css('height');
    if(height == '50px'){
        $('div#b1').animate({
        'width' : '1100'
    }, 200);
    }
});
$('img#b1').on('mouseout', function() {
    var height = $('div#b1').css('height');
    if(height == '50px'){
        $('div#b1').animate({
        'width' : '990'
    }, 200);
    }
});

funciona, pero si usted puede rápidamente pasar ratón por encima y por fuera por unos momentos, a continuación, tome la salida de ratón, se reanudará la animación para los tiempos de ratón se fue por encima de ella.

no quiero reanudar la animación si el ratón no está sobre él.

¿cómo puedo arreglar eso?

3 Kommentare

  1. 2

    Debe un código como el siguiente:

    $('img#b1').on({
        mouseenter: function() {
            var height = $('div#b1').css('height');
            if(height === '50px'){
                $('div#b1').stop().animate({
                    width: 1100
                }, 200);
            }
        },
        mouseout: function() {
            var height = $('div#b1').css('height');
            if(height === '50px'){
                $('div#b1').stop().animate({
                    width: 990
                }, 200);
            }
        }
    });

    Hace el código más claramente.

  2. 1

    Usted necesita para detener la animación como esta:

    $('img#b1').on('mouseenter', function() {
        var height = $('div#b1').css('height');
        if(height == '50px'){
            $('div#b1').stop().animate({
            'width' : '1100'
        }, 200);
        }
    });
    $('img#b1').on('mouseout', function() {
        var height = $('div#b1').css('height');
        if(height == '50px'){
            $('div#b1').stop().animate({
            'width' : '990'
        }, 200);
        }
    });

Kommentieren Sie den Artikel

Bitte geben Sie Ihren Kommentar ein!
Bitte geben Sie hier Ihren Namen ein

Recent Articles

Python «set» con duplicados/elementos repetidos

Hay una forma estándar de representar un "conjunto" que puede contener elementos duplicados. Como yo lo entiendo, un conjunto tiene exactamente un cero o...

Python: generador de expresión vs rendimiento

En Python, ¿hay alguna diferencia entre la creación de un generador de objetos a través de un generador de expresión versus el uso de...

Cómo exportar/importar la Masilla lista de sesiones?

Hay una manera de hacer esto? O tengo que tomar manualmente cada archivo de Registro? InformationsquelleAutor s.webbandit | 2012-10-23

no distingue mayúsculas de minúsculas coincidentes en xpath?

Por ejemplo, para el xml a continuación <CATALOG> <CD title="Empire Burlesque"/> <CD title="empire burlesque"/> <CD...