2

i got the following problem: I got a h2, nested in a div with the id : <div id="hidediv1">.
I got this code 

$("#hidediv1").mouseover(function(){
  $('#hide1').show(500);
});
$("#hidediv1").mouseleave(function(){
  $('#hide1').hide(500);
});

I want it to be, that you have to hover over the div for atleast 1 second to trigger it. I know, there are several questions on stackoverflow, but i coulnd't apply them to my code.
Please help!
Thank you.

Jishnu V S
  • 8,164
  • 7
  • 27
  • 57
tatanga1888
  • 39
  • 2
  • Possible duplicate of [Fire an event handler after a certain amount of time](http://stackoverflow.com/questions/7148447/fire-an-event-handler-after-a-certain-amount-of-time) – wscourge Dec 09 '16 at 10:35
  • 2
    Possible duplicate of [Delay jquery hover event?](http://stackoverflow.com/questions/435732/delay-jquery-hover-event) – Vanquished Wombat Dec 09 '16 at 10:37

2 Answers2

1

You can delay it using:

$("#hidediv1").mouseenter(function() {
  $('#hide1').delay(1000).show(500);
}).mouseleave(function() {
  $('#hide1').stop(true).hide(500);
});

stop(true) would avoid some queue pending issue.

BTW, you have better in most cases to use mouseenter instead of mouseover.

A. Wolff
  • 74,033
  • 9
  • 94
  • 155
0
$(document).ready(function(){
$("#div1").mouseover(function(){
    $("#div2").hide(1000);
});
$("#div1").mouseout(function(){
    $("#div2").show(1000);
    });
});

Try this..

Gourav
  • 26
  • 4