.toggle为我的锚标签设置动画，而不是将其用作点击

Question

我知道.toggle可以执行两个不同的事情，如果你提供两个函数，它应该提供一个切换按钮点击和关闭排序但我的代码正在使动画立即发生，锚标记只是消失

HTML

<nav class="mainNav">
                    <ul>
                        <li class="home"><a href="#">home</a></li>
                        <li class="work"><a href="#">work</a></li>
                        <li class="blog"><a href="#">blog</a></li>
                        <li class="contact"><a href="#">contact</a></li>

                    </ul>
                    <a href="#" id="toggle">HI</a>
                </nav>

JS

$(function() {
    $(".rslides").responsiveSlides({auto:true});

    $("#toggle").toggle(function(){
        $(".mainNav ul").slideDown();
    }, function(){
        $(".mainNav ul").slideUp();
    });


});

Answer 1

您的切换方法是切换#toggle，您传递给切换的功能是切换动画完成后回调的功能http://api.jquery.com/toggle/

最好使用SlideToggle，

$('#toggle').click(function() {
  $('.mainNav ul').slideToggle('slow', function() {
    // Animation complete.
  });
});