JQUERY: Temas de tiempo de Fadein / Fadeo

Question

En un sitio, estoy gestionando, tengo este enlace de estilo que, en el clic, se desvanece en una lista de caídas debajo, para que el usuario pueda seleccionar un género.

Tengo el desvanecimiento en funcionamiento perfectamente, el problema en el que estoy corriendo es tratar de determinar si la lista desplegable flotaba o no para poder ocultarlo si el usuario se desvanece del enlace de estilo sin entrar en la caídaLista hacia abajo.

Por lo tanto, la lista desplegable se desvanece, el usuario no ingresa al elemento desplegable desplegable, sin embargo, el elemento se desvanece, si el usuario ingresa al elemento desplegable desplegable (mientras que dejan el enlace enlazado que desencadena el Fadein)Luego, la caída debe permanecer mostrada hasta que salga del elemento desplegable.

Aquí está el código que tengo hasta ahora:

$('#categories_link').live('click mouseleave', function(e){
    $('.categories').fadeIn(200, function(){
        $(this).live('mouseenter mouseleave', function(evnt){
            switch(evnt.type) {
                case "mouseenter":
                    $(this).stop(true, true)
                    $(this).data('visible', true)
                break;

                case "mouseleave":
                    $(this).data('visible', false)
                break;
            }
        })

        if(e.type == 'mouseleave') {
            if($('.categories').data('visible'))
                return;
            else
                $('.categories').fadeOut(200)
        }
    })
})

Answer 1

La estructura es muy problemática.¿Por qué agregas oyentes en la licencia del mouse?

Lo mejor que podrías hacer es

• Ajustar el Fadein para que aparezca en el mouseEnter
• Configure Fadeout en Mouseleave con un retardo de ~ 300-400 ms usando Settimeout ()
• Configure la caída real para desvanecerse en el mouseEnter, usando una parada antes de eso (es decir,: STOP (VERDADERO, VERDADERO) .Fadein (200), pero use ClearTimeOut () antes de que esto suceda dentro del manejador de eventos.
• Configure la caída real a Fadeout en Mouseleave

  En realidad, debe usar una parada (verdadera, cierta) antes de todas estas animaciones.

  La lógica Detrás de esto es que si el usuario se detiene sobre el menú desplegable, el menú desplegable intentará desvanecerse en la cancelación de la cancelación del faimado que está en cola (agregó un temporizador adicional 200-300SEC).

  Otra forma de hacerlo, es el desplegamiento dentro de la etiqueta principal, por lo que mientras está flotando dentro de la desplegable, no se desvanecerá de ninguna manera (esto también funciona con CSS puro)