jQuery效果

隐藏和显示

语法：

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

$(selector).toggle(speed,callback);

可以取以下值："slow"、"fast" 或毫秒。

   可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

淡入和淡出

$(selector).fadeIn(speed,callback);



$(selector).fadeOut(speed,callback);



$(selector).fadeToggle(speed,callback);



$(selector).fadeTo(speed,opacity,callback);

滑动

$(selector).slideDown(speed,callback);



$(selector).slideUp(speed,callback);



$(selector).slideToggle(speed,callback);

动画

$(selector).animate({params},speed,callback);

必需的 params 参数定义形成动画的 CSS 属性。

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是动画完成后所执行的函数名称。

$("button").click(function(){
  $("div").animate({left:'250px'});
}); 




$("button").click(function(){
 $("div").animate({
left:'250px',
opacity:'0.5',
height:'150px',
 width:'150px'
});
}); 




$("button").click(function(){
 $("div").animate({
left:'250px',
height:'+=150px',
width:'+=150px'
});
});




$("button").click(function(){
 $("div").animate({
 height:'toggle'
});
});






$("button").click(function(){
var div=$("div");
div.animate({height:'300px',opacity:'0.4'},"slow");
div.animate({width:'300px',opacity:'0.8'},"slow");
div.animate({height:'100px',opacity:'0.4'},"slow");
div.animate({width:'100px',opacity:'0.8'},"slow");
});





$("button").click(function(){
var div=$("div");  
div.animate({left:'100px'},"slow");
div.animate({fontSize:'3em'},"slow");
});

停止动画

$(selector).stop(stopAll,goToEnd);