延迟后更改hoverintent设置

Question

我正在使用hoverintent作为下拉菜单，并希望在短暂（例如2秒左右）延迟后自动将间隔值修改为更小的值。

这是我正在使用的javascript：

    var config = {    
     over: mousein_triger,  
     interval: 1000,   
     timeout: 100,     
     out: mouseout_triger 
};

$(document).ready(function() {
$('.panel').hide();
$("#navigation").hoverIntent(config);
$('.mncontent').focusin(function() {
        $('.panel').slideUp('fast');
    });
    $('#navigation ul li a').focus(function() {
        $('.panel').slideDown('');
    });
});

// expand the height of the container

function mousein_triger(){

    $('.panel').slideDown('');

}

// reset the height of the container

function mouseout_triger() {

$('.panel').slideUp('');

}

这是HTML：

<div id="navigation">
<ul id="child-navigation">
<li class="menubut"><a href="#"></a>
<ul class="panel">
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
</ul>
</li>
<li class="menubut"><a href="#">Get Help</a>
<ul class="panel">
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
</ul>
</li>
</ul>
</div>