jQuery动画效果案例

 br>// 淡入淡出
$( "#btn-fadeIn" ).click(function() {
 $( "#box" ).fadeIn( "slow", function() {
   // Animation complete.
 });
});
$( "#btn-fadeOut" ).click(function() {
 $( "#box" ).fadeOut( "slow", function() {
   // Animation complete.
 });
});

// 滑动
$( "#btn-slideUp" ).click(function() {
 $( "#box" ).slideUp( "slow", function() {
   // Animation complete.
 });
});
$( "#btn-slideDown" ).click(function() {
 $( "#box" ).slideDown( "slow", function() {
   // Animation complete.
 });
});

// 动画
$( "#btn-animate" ).click(function() {
 $( "#box" ).animate({
   opacity: 0.25,
   left: "+=50"
 }, 500, function() {
   // Animation complete.
 });
});