javascript - 关于将jQuery与hoverIntent.js插件一起使用的问题

我正在尝试在名为hoverIntent.js的一个元素上使用jQuery和navbar，如下所示

 $(".navbar").hoverIntent({
    over:  $(".navbar").animate({height: "100px"}),
    out:   $(".navbar").animate({height: "50px"})
  });

.navbar{background:grey;  height:50px;  width:300px;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.hoverintent/1.8.1/jquery.hoverIntent.min.js"></script>

<nav class="navbar navbar-default">
  <div class="container-fluid"> </div>
</nav>

   


我尝试了以下两种方法，但没有一种有效

 $(".navbar").hoverIntent({
    over:  $(".navbar").animate({height: "100px"}),
    out:   $(".navbar").animate({height: "50px"})
  });

$(".navbar").hoverIntent({
function() {
    $(".navbar").animate({height: "100px"});
  }, function() {
    $(".navbar").animate({height: "50px"});
  }
});

但它不起作用。你能让我知道如何解决吗？

最佳答案

将它们放在函数中...

$(".navbar").hoverIntent({
    over:  function(){ $(".navbar").animate({height: "100px"}) },
    out:   function(){ $(".navbar").animate({height: "50px"}) }
  });

.navbar{background:grey;  height:50px;  width:300px;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.hoverintent/1.8.1/jquery.hoverIntent.min.js"></script>

<nav class="navbar navbar-default">
  <div class="container-fluid"> </div>
</nav>

关于javascript - 关于将jQuery与hoverIntent.js插件一起使用的问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40642831/