javascript - After click, reverse animation on jQuery (Show/Hide) -

javascript - After click, reverse animation on jQuery (Show/Hide) -

i'm trying utilize the:

$(document).ready(function() { $('#showmenu1').click(function() { $('.menu1').slidedown("slow"); }); });

effect in jquery create div appear when trigger clicked, successfully. want animation reverse create div disappear, when same trigger clicked again. effect want create is:

$(document).ready(function() { $('#showmenu1').click(function() { $('.menu1').slideup("slow"); }); });

any help 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 shown</p> </li> </ul> </div>

cheers

$('#showmenu1').click(function() { $('.menu1').slidetoggle("slow"); });

demo : http://jsfiddle.net/wl71w8td/

javascript jquery