Jquery效果方法

animate()对被 选元素应用自定义的动画

$(document).ready(function(){
    $("#btn1").click(function(){
        $("#box").animate({height:"300px"});
    });
    $("#btn2").click(function(){
        $("#box").animate({height:"100px"});
    });
});

delay() 对被选元素的所有排队函数（仍未运行）设置延迟

$(document).ready(function(){
    $("button").click(function(){
        $("#div1").delay("slow").fadeIn();
        $("#div2").delay("fast").fadeIn();
        $("#div3").delay(800).fadeIn();
        $("#div4").delay(2000).fadeIn();
        $("#div5").delay(4000).fadeIn();

    });
});

fadeIn()逐渐改变被选元素的不透明度，从隐藏到可见

$(document).ready(function(){
    $(".btn1").click(function(){
        $("p").fadeOut()
    });
    $(".btn2").click(function(){
        $("p").fadeIn();
    });
});

fadeOut()逐渐改变被选元素的不透明度，从可见到隐藏

$(document).ready(function(){
    $(".btn1").click(function(){
        $("p").fadeOut()
    });
    $(".btn2").click(function(){
        $("p").fadeIn();
    });
});

fadeTo()把被选元素逐渐改变至给定的不透明度

$(document).ready(function(){
    $("button").click(function(){
        $("p").fadeTo(1000,0.4);
    });
});

fadeToggle()在 fadeIn() 和 fadeOut() 方法之间进行切换

$(document).ready(function(){
    $("button").click(function(){
        $("#div1").fadeToggle();
        $("#div2").fadeToggle("slow");
        $("#div3").fadeToggle(3000);
    });
});

finish()对被选元素停止、移除并完成所有排队动画

$(document).ready(function(){
    $("#start").click(function(){
        $("div").animate({height:300},3000);
        $("div").animate({width:300},3000);
    });
    $("#complete").click(function(){
        $("div").finish();
    });
});

hide()隐藏被选元素

$(document).ready(function(){
    $(".btn1").click(function(){
        $("p").hide();
    });
    $(".btn2").click(function(){
        $("p").show();
    });
});

show()显示被选元素

$(document).ready(function(){
    $(".btn1").click(function(){
        $("p").hide();
    });
    $(".btn2").click(function(){
        $("p").show();
    });
});

slideDown()通过调整高度来滑动显示被选元素

$(document).ready(function(){
    $(".btn1").click(function(){
        $("p").slideUp();
    });
    $(".btn2").click(function(){
        $("p").slideDown();
    });
});

slideToggle()slideUp() 和 slideDown() 方法之间的切换

$(document).ready(function(){
    $("button").click(function(){
        $("p").slideToggle();
    });
});

slideUp()过调整高度来滑动隐藏被选元素

$(document).ready(function(){
    $(".btn1").click(function(){
        $("p").slideUp();
    });
    $(".btn2").click(function(){
        $("p").slideDown();
    });
});

stop()停止被选元素上当前正在运行的动画

$(document).ready(function(){
    $("#start").click(function(){
        $("div").animate({height:300},3000);
        $("div").animate({width:300},3000);
    });
    $("#stop").click(function(){
        $("div").stop();
    });
});

toggle()hide() 和 show() 方法之间的切换

$(document).ready(function(){
    $("button").click(function(){
        $("p").toggle();
    });
});