jQuery中的动画

1.show()方法和hide()方法
两个方法在没有参数的情况下，作用是立即隐藏或显示匹配的元素。slow则在600毫秒显示，normal为400毫秒，fast为200毫秒。如果使元素1秒钟显示出来，则如下例

例：$("element").show(1000);

2.fadeIn()方法和fadeOut()方法
两个方法只改变元素的不透明度。fadeOut()方法会在指定的一段时间内降低元素的不透明度，fadeIn()方法则完全相反
3.slideUp()方法和slideDown()方法
两个方法只改变元素的高度。slideDown()方法使元素由上至下延伸显示，slideUp()方法正好相反
4.animate(params,speed,callback)
参数说明如下：
params:一个个包含样式属性及值的映射，
如：{property1:”value1”,property2:”value2”}
speed:速度参数，可选
callback:在动画完成时执行的函数，可选。

例：1.同时执行多个动画
$(function () {
    $("#myImg").click(function () {
        $(this).animate({left: "500px",height: "200px"},3000);
    });
});
2.单击<div>元素后让它向右移动的同时增大它的高度，并将不透明度从50%变换到100%，然后在让它从上到下移动，同时宽度变大，完成这些效果后，让它以淡出的方式隐藏
$(function () {
    $("#panel").css("opacity","0.5");
    $("#panel").click(function () {
                $(this).animate({left:"400px",height:"200px",opacity:"1",3000).animate({top:"200px",width:"200px"},3000).fadeOut("slow");
    });
});

5.停止动画stop([clearQueue],[gotoEnd]),两个参数均为可选参数，为Boolean值，第一个代表的是否要清空未执行完的动画队列，gotoEnd代表是否将正在执行的动画跳转到末状态

例：
$(function () {
    $("#panel").hover(function () {
        $(this).stop(true)
            .animate({height:"150"},200)
            .animate({width:"300"},300)
    },function () {
        $(this).stop(true)
            .animate({height:"22"},200)
            .animate({width:"60"},300)
    });
});