jQuery动画-如何在第二次单击时滑入和滑出？

Question

如何使用jquery动画在点击时滑出并在点击中滑入？ 在我的代码中（如下），我滑出了一个div，但是无法基于单击将其滑回。 我该怎么办？ 谢谢！

的HTML：

<nav>
    <ul id="menu">
        <span id="toggle" class="glyphicon glyphicon-align-justify"></span>
        <li><span class="glyphicon glyphicon-home"></span><a>Home</a></li>
        <li><span class="glyphicon glyphicon-user"></span><a>About</a></li>
        <li><span class="glyphicon glyphicon-blackboard"></span><a>Portfolio</a></li>
        <li><span class="glyphicon glyphicon-envelope"></span><a>Contact</a></li>
    </ul>
</nav>

js：

$('#toggle').click(function() {
    if ('#menu'){
        $('#menu').animate({
            //  height: 'toggle'
        }, 1500, function() {
        });
    }
 });

Answer 1

jQuery库中有一个名为is的函数。 您可以使用它来检查输入是否被隐藏或显示：

if ($('#x').is(':visible')) {
    $('#x').slideUp('fast');
} else {
    $('#x').slideDown('fast');
}

Answer 2

我认为您可以简单地使用slideToggle() 。

$('#toggle').click(function() {
  $('#menu').slideToggle();
});