Re-establish hover upon delay
I'm trying to wrap my head around this concept of having a div tag be clickable and hoverable, but upon clicking on it the "hover" functionality be removed and upon clicking it again the "hover" functionality be ADDED again, but with a slight delay. The following is my code, but I cant figure out how to add in the delay for this? Any ideas or suggestions with what I have? Thanks in advance
- $(document).ready(
function
() { $(
function
() { $(
'div.fcrInfoDiv'
).hover(
function
(){ $(
this
).animate({top:
'170px'
},{queue:
false
,duration:400}); },
function
(){ $(
this
).animate({top:
'189px'
},{queue:
false
,duration:600}); }); }); $(
function
() { $(
'div.fcrInfoDiv'
).toggle(
function
(){ $(
this
).unbind(
'mouseenter'
).unbind(
'mouseleave'
); $(
this
).animate({top:
'6px'
},{queue:
false
,duration:600}); },
function
(){ $(
this
).animate({top:
'189px'
},{queue:
false
,duration:600}); $(
'div.fcrInfoDiv'
).hover(
function
(){ $(
this
).animate({top:
'170px'
},{queue:
false
,duration:400}); },
function
(){ $(
this
).animate({top:
'189px'
},{queue:
false
,duration:600}); }); }); }); });