Jquery 带有滑动切换的hoverintent.js

我有一个带有以下标记的导航菜单：

<ul class="main-nav">
    <li><a href="url/page">Parent</a>
        <ul class="main-nav-child">
            <li><a href="url/page">Child</a></li>
            <li><a href="url/page">Child</a></li>
            <li><a href="url/page">Child</a></li>
        </ul>
     </li>
</ul>

我正试图让它与hoverintent.js插件一起工作，在回顾了给出的示例之后，我仍然处于工作的死胡同

以下是我迄今为止所尝试的：

$('.main-nav > li').hover(function(){
        $('ul', this).doTimeout( 'slideToggle', 250 );
    }, function(){
        $('ul', this).doTimeout( 'slideToggle', 250 );
});

感谢您的帮助或指导。

尝试以下方法：

---

这当然解决了我上面的示例问题，谢谢！一个小小的警告：当有多个父项时，所有子元素都会同时切换，我应该在我的问题中说明这一点，抱歉，我猜我会说我需要这个，我可以再次请求您的帮助吗？请您举一个例子说明您的意思吗=您可以用我的小提琴来解释问题确定：，当您悬停在上时。主导航li所有儿童ul打开，如果有意义，我只希望悬停在家长的儿童ul上。谢谢你的帮助。但是我感觉你在寻找更像这样的东西：

$('.main-nav > li').hover(function(){
        $('ul', this).doTimeout( 'slideToggle', 250 );
    }, function(){
        $('ul', this).doTimeout( 'slideToggle', 250 );
});

$(function () {
    $('ul.main-nav-child').hide();
    $('.main-nav > li').hover(function(){
        $(this).doTimeout( 'hover', 250, function() {
            $('.main-nav-child').slideToggle(250);
        });
    });
});