How can we set time or delay of 5 seconds in dropdown sub menu?
<p>How can we set time or delay of 5 seconds in dropdown.</p>

<p>Requirement are like this: When someone hover over main menu then its shows that submenu for 5 sec only when your mouse is away from main menu or sub menu.</p>

<p>For now i have increased the height of ul upto height of banner images so that it will not be hide untill you move your mouse out of that banner area.</p>

<p>Below is the site link: <a href="http://transitions.advisorproducts.com/home" rel="nofollow">http://transitions.advisorproducts.com/home</a></p>

<p>and this is one reference site link : <a href="http://focusyou.com/home" rel="nofollow">http://focusyou.com/home</a> (my requirement are like this, but i don't want to copy this code, i want to implement in my own code)</p>

<p>Below is the js:</p>

<pre><code>$(function()
{
    $("ul.dropdown li").hover(function()
    {
        $(this).addClass("hover");
        $('ul:first',this).css('visibility', 'visible');
    }, function()
    {
        $(this).removeClass("hover");
        $('ul:first',this).css('visibility', 'hidden');
    });
    $("ul.dropdown li ul li:has(ul)").find("a:first").append(" &amp;raquo; ");
});
</code></pre>

<p>Thanks in advance :)</p>

<p>You can test here : <a href="http://jsfiddle.net/alokjain_lucky/KQAYT/2/" rel="nofollow">http://jsfiddle.net/alokjain_lucky/KQAYT/2/</a></p>
