Introduce a small delay before firing jquery slideToggle() -

I have a simple down menu bar that is mostly hidden, unless there is no mash on a transparent device. The point at which the menu bar slides down to toggle () 'ed'

  & lt; Script type = "text / javascript" & gt; $ ('Document'). $ ('' Bottom '' ($ '' 'box box' below) .on ("mouseleave", function () {$ ('# below box'). Slide toggle ();});}); & Lt; / Script & gt;  

However, if someone accidentally transmits the mouse over it, then it is still pop up and is upset. Depending on the mouse pointer, how can I delay this action (say 0.5 seconds) to wait for a transparent device for this action?

You can set it to setTimeout function:

  $ ('# BottomBoxThinCover') with adding a little timeout. "Mouseover", function () {$ (this) .data ('over', settimeout (function) ($ ('# box below') SlideToggle ();}, 500));}) .on ('mouseout ', Function () {explicit timed out ($ (this) .data (' over ')););  

The idea is that you set up a timeout on mouseover, and clear it on mouseout. You can use element data collection to save timeout IDs.

Demo: