jquery - 遅延後に 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>