closing other sub-menus
<p>i have menu like this</p>

<pre><code>&lt;ul&gt;
    &lt;li&gt;
        &lt;a href="#"&gt;Home&lt;/a&gt;
        &lt;ul class="sub"&gt;
            &lt;li&gt;Text&lt;/li&gt;
            &lt;li&gt;Test&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;a href="#"&gt;About&lt;/a&gt;
        &lt;ul class="sub"&gt;
            &lt;li&gt;Text&lt;/li&gt;
            &lt;li&gt;Test&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;a href="#"&gt;Contact&lt;/a&gt;
        &lt;ul class="sub"&gt;
            &lt;li&gt;Text&lt;/li&gt;
            &lt;li&gt;Test&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;   
&lt;/ul&gt;
</code></pre>

<p>I am using hoverIntent plugin that cause the sub-menu to remain opened for 3 seconds. But i want to close the other opened sub-menu on hovering a main menu. How to close other sub-menus?</p>

<p>here is js code</p>

<pre><code>$('ul &gt; li').hoverIntent({
        over: function(){
            $(this).children('ul').slideDown('slow');
        },
        timeout: 3000,
        out: function(){
            $(this).children('ul').slideUp();
        }
    });
</code></pre>
