Si el mouse se pasa por más de 2 segundos, entonces, ¿qué no?

Question

Aquí hay una función de diapositivas jQuery que he aplicado a un div en vuelo estacionario para deslizar un botón hacia abajo.

Funciona bien, excepto que ahora cada vez que alguien se mueve dentro y fuera de él, sigue subiendo y bajando.

Pensé que si ponía un temporizador de retardo de uno o dos segundos tendría más sentido.

¿Cómo modificaría la función para ejecutar la diapositiva hacia abajo solo si el usuario está en el div durante más de un segundo o dos?

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js "></script> 
<script type="text/javascript"> 

$("#NewsStrip").hover(
function() { 
    $("#SeeAllEvents").slideDown('slow'); }, 
function() { 
    $("#SeeAllEvents").slideUp('slow'); 
}); 

</script> 

Answer 1

Es necesario configurar un temporizador en mouseover y claro, bien cuando la tapa está activado o al desplazar el ratón, lo que ocurra primero:

var timeoutId; 
$("#NewsStrip").hover(function() { 
    if (!timeoutId) { 
     timeoutId = window.setTimeout(function() { 
      timeoutId = null; // EDIT: added this line 
      $("#SeeAllEvents").slideDown('slow'); 
     }, 2000); 
    } 
}, 
function() { 
    if (timeoutId) { 
     window.clearTimeout(timeoutId); 
     timeoutId = null; 
    } 
    else { 
     $("#SeeAllEvents").slideUp('slow'); 
    } 
}); 

See it in action.

Answer 2

var time_id; 

$("#NewsStrip").hover(
function() { 
    if (time_id) { 
     clearTimeout(time_id); 
    } 
    time_id = setTimeout(function() { 
     $("#SeeAllEvents").stop(true, true).slideDown('slow'); 
    }, 2000); 
}, function() { 
    if (time_id) { 
     clearTimeout(time_id); 
    } 
    time_id = setTimeout(function() { 
     $("#SeeAllEvents").stop(true, true).slideUp('slow'); 
    }, 2000); 
});