• 隱藏/顯示
  jQuery hide()和show()：

$("#hide").click(function(){
    $("p").hide();
});
$("#show").click(function(){
    $("p").show();
});
// 也可以使用帶參數(shù)的 $("p").show(2000);

jQuery toggle()：

//用來(lái)切換hide()和show()方法，顯示被隱藏的元素或隱藏已顯示的元素。
$("button").click(function(){
    $("p").toggle();
});
// 同樣可以使用帶參數(shù)的 $("p").toggle(2000);

• 淡入淡出
  fadeIn()、fadeOut()、fadeToggle()、fadeTo()

$("button").click(function(){
    // 淡入效果，可以帶參數(shù)，淡入的時(shí)間（毫秒）
    $("div1").fadeIn();
    $("div2").dadeIn(1000);
    // 淡出效果，帶參數(shù)為淡出時(shí)間
    $("div1").fadeOut();
    $("div2").fadeOut(2000);
    // fadeToggle()用于fadeIn()和fadeOut()之間切換
    $("div1").fadeToggle();
    $("div2").fadeToggle("slow");
    // fadeTo()用于漸變?yōu)橹付ǖ牟煌该鞫龋?-1之間）
    $("#div1").fadeTo("slow",0.15);
    $("#div2").fadeTo(2000,0.4);
});

• 滑動(dòng)
  jQuery slideDown()、slideUp()、slideToggle()

$('button').click(function(){
    // slideDown()用于向下滑動(dòng)元素
    $('p#in').slideDown('slow');
    //  slideUp()用于向上滑動(dòng)元素
    $('p#out').slideUp(3000);
    // slideToggle()用于slideDown()和slideUp()之間切換
    $("p#toggle").slideToggle();
});

• 動(dòng)畫
  $(selector).animate({params},speed,callback);
  params為比傳，speed和callback可選

$('button').click(function(){
    // 將一個(gè)<div>移動(dòng)到左邊
    $('div').animate({left:'100px'});
    // 也可以同時(shí)操作多個(gè)屬性
    $('div').animate({left:'200px', opacity:'0.4', height:'100px', width:'50px'});
    // 或者相對(duì)屬性值
    $('div').animate({left:'200px', height:'+=100px', width:'+=50px'});
    // 使用動(dòng)畫集合
    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");
});

• stop()
  jQuery stop()方法用于停止正在之行的動(dòng)畫或效果。
  $(selector).stop(stopAll,goToEnd);
  stopAll為可選，是否清楚隊(duì)列，默認(rèn)為false，僅停止動(dòng)畫；
  goToEnd為可選，是否立即完成當(dāng)前動(dòng)畫，默認(rèn)為false；

$(document).ready(function(){
    $("#flip").click(function(){
        $("p").slideDown(4000);
    });
    $("#stop").click(function(){
        $("p").stop();
    });
});

• Callback
  在所有效果之行結(jié)束后都可以使用callback來(lái)之行其他動(dòng)作，比如：

$("button").click(function(){
    $("p").hide(1000,function(){
        alert("<p>隱藏了");
    });
});

• Chaining
  跟其他語(yǔ)言一樣，jQuery也可以對(duì)同一個(gè)元素之行多條命令，如：

//把<p>字體顏色變紅，向上移動(dòng)后再向下移動(dòng)
$("p").css("color","red").slideUp(1000).slideDown(1000);