点击后，在jQuery上反向动画（显示/隐藏）(After click, reverse animation on jQuery (Show/Hide))

 我正在尝试使用： 
 
$(document).ready(function() {
    $('#showmenu1').click(function() {
            $('.menu1').slideDown("slow");
    });
});
 
 jQuery中的效果可以在单击触发器时显示div，这非常成功。 但是，当再次单击相同的触发器时，我希望动画反转以使div消失。 我想要的效果是： 
 
$(document).ready(function() {
    $('#showmenu1').click(function() {
            $('.menu1').slideUp("slow");
    });
});
 
 任何帮助将不胜感激。 
 
 HTML示例： 
 
<section id="showmenu1" style="background-color:#09F; color:#fff">
    <h1>Show Div</h1>
</section>
<div class="menu1" style="display: none; background-color:#09F; color:#fff; padding:0; margin:0">
    <ul style="padding:0px; margin:0px; position: relative; text-align: center;">
        <li>
            <h1 style="margin-top:0">Hello Div</h1>
            <p style="margin-top:0">Div is shown</p>
        </li>
    </ul>
</div>
 
 干杯 

I'm trying to use the:
 
$(document).ready(function() {
    $('#showmenu1').click(function() {
            $('.menu1').slideDown("slow");
    });
});
 
Effect in jQuery to make a div appear when a trigger is clicked, which it does very successfully. However I want the animation to reverse to make the div disappear, when that same trigger is clicked again. The effect I want to make is:
 
$(document).ready(function() {
    $('#showmenu1').click(function() {
            $('.menu1').slideUp("slow");
    });
});
 
Any help would be greatly appreciated.
 
HTML Example:
 
<section id="showmenu1" style="background-color:#09F; color:#fff">
    <h1>Show Div</h1>
</section>
<div class="menu1" style="display: none; background-color:#09F; color:#fff; padding:0; margin:0">
    <ul style="padding:0px; margin:0px; position: relative; text-align: center;">
        <li>
            <h1 style="margin-top:0">Hello Div</h1>
            <p style="margin-top:0">Div is shown</p>
        </li>
    </ul>
</div>
 
Cheers

原文：