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
$('#showmenu1').click(function() {
$('.menu1').slideToggle("slow");
});
ToggleSimply use slideToggle instead:
$(document).ready(function() {
$('#showmenu1').click(function() {
$('.menu1').slideToggle("slow");
});
});
Try this:
$("div").click(function() {
$(this).hide("slide", {
direction: "down"
}, 1000);
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.