如何与hoverIntent集成?

时间:2013-01-08 10:52:08

标签: jquery drop-down-menu menu hoverintent

这是一个新手。 我有一个菜单,使用jQuery幻灯片效果。我想与hoverIntent集成。我尝试包含该文件,但仍然没有工作。你们能帮助我吗? :)

<ul id="nav">
    <li><a href="1.html" id="CorporateMenu">Corporate Profile</a>

        <ul>
            <li><a href="#">Vision &amp; Mission</a>
            </li>
            <li><a href="#">Board of Director</a>
            </li>
            <li><a href="#">Senior Management</a>
            </li>
            <li><a href="#">Group Companies</a>
            </li>
        </ul>
    </li>
    <li><a href="index.html" id="HomeMenu">Home</a>
    </li>
</ul>
<!-- menu dropdown animated -->
<script type="text/javascript">
    $(document).ready(function() {
        $('#nav li').hover(function() {
            $('ul', this).slideDown(250);
            $(this).children('a:first').addClass("hov");
        }, function() {
            $('ul', this).slideUp(150);
            $(this).children('a:first').removeClass("hov");
        });
    });
</script>

1 个答案:

答案 0 :(得分:3)

听起来你正在使用hoverIntent插件。如果这是真的使用.hoverIntent而不是.hover作为事件。

小提琴:http://jsfiddle.net/HbjuW/

$(document).ready(function() {   
  $('#nav li').has('ul').hoverIntent({
    over: function() {
      $('ul', this).slideDown(250);
      $(this).children('a:first').addClass("hov");
    },
    timeout: 500,
    out: function() {
      $('ul', this).slideUp(150);
      $(this).children('a:first').removeClass("hov");
    }
  });
});