jQuery Effects and Animations
Creating animations and effects
Show and Hide
$('div').show(); # show element
$('div').hide(); # hide element
$('div').toggle(); # toggle visibility
Fade Effects
$('div').fadeIn(); # fade in
$('div').fadeOut(); # fade out
$('div').fadeToggle(); # toggle fade
$('div').fadeTo(500, 0.5); # fade to opacity
Slide Effects
$('div').slideDown(); # slide down
$('div').slideUp(); # slide up
$('div').slideToggle(); # toggle slide
Custom Animation
$('div').animate({ # custom animation
left: '250px',
opacity: 0.5,
width: '300px'
}, 1000); # duration in ms
Animation Control
$('div').stop(); # stop animation
$('div').delay(1000); # delay animation
Callback
$('div').fadeOut(500, function() { # callback after animation
alert('Animation complete');
});