jq动画

方法 .show( )显示

        .hide( )隐藏

        .toggle( )切换

点击自动执行显示隐藏用：

    .toggle( 时间，arguments.callee)

滑动：

slideUp( )向上滑动（隐藏）

slideDown( ) 向下滑动 （显示）

slideToggle( ) 滑动（自动）

淡入淡出

fadeOut( )淡出

fadeIn ( )淡入

fadeToggle( )显示隐藏（）自动

--------------------------------------------------------------------------------------------------------------

自定义动画

animate( )方法

三个参数  目标 执行时间 回调函数

第一个为必填参数

$("box").animate({

    "width":"200px";

    "height":"200px";

})

动画的执行顺序

如果想要动画按照顺序执行（执行完第一个动画，再执行第二个动画）

1.借助动画的回调函数

$('input').click(function( ){

    $('div').animate({

'width':'400px';

'height':'400px';

},function(){

$('div').animate({

'width':'200px';

'height':'200px';

})

})

})

2.将动画分开写

 

$('input').click(function( ){

    $('div').animate({

'width':'400px';

'height':'400px';

}）

    $('div').animate({

'width':'200px';

'height':'200px';

}）

}）

3.连缀

 

$('input').click(function( ){

    $('div').animate({

'width':'400px';

'height':'400px';

}）.animate({

'width':'200px';

'height':'200px';

}）

}）

-----------------------------------------------------------------------------------------------------------------------------

动画及相关方法：

.stop( true,flase)

停止动画，两个参数，都是布尔值

第一个参数代表是否清除动画队列，第二个参数代表是否直接运行到最后的结果

.end( )

终止上个选择器的遍历，回到上个选择器

.delay( )方法 里面加时间

延时执行，该方法有一个参数，是延时执行的毫秒数

动画递归