jQuery——动画

显示和隐藏动画

显示动画 show()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').show(1000,function(){})

隐藏动画 hide()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').hide(1000,function(){})

切换显示和隐藏动画 toggle()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').toggle(1000,function(){})

展开和收起动画

展开动画 slideDown()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').slideDown(1000,function(){})

收起动画 slideUp()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').slideUp(1000,function(){})

切换展开和收起动画 slideToggle()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').slideToggle(1000,function(){})

淡入和淡出动画

淡入动画 fadeIn()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').fadeIn(1000,function(){})

淡出动画 fadeOut()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').fadeOut(1000,function(){})

切换淡入淡出动画 fadeToggle()

//第一个参数：动画时长
//第二个参数：动画执行完毕之后的回调函数
$('div').fadeToggle(1000,function(){})

淡入到动画 fadeTo()

//第一个参数：动画时长
//第二个参数：淡入的一个程度
//第三个参数：动画执行完毕之后的回调函数
$('div').fadeTo(1000,0.5,function(){})

自定义动画

animate()

//第一个参数：一个对象：里面写要执行动画的属性
//第二个参数：动画时长
//第三个参数：指定动画节奏：默认swing（缓动、先慢后快再慢）。另外还有参数linear（匀速）
//第四个参数：动画执行完毕之后的回调函数
$('div').animate({
width:500
},1000,'linear',function(){})

延迟动画

delay()

$('div').animate({
width:500
},1000).delay(2000).animate({
height:500
},1000)

停止动画

stop()

//1、立即停止当前动画，继续执行后续动画
$('div').stop()
//2、立即停止当前和后续的所有动画
$('div').stop(true)
//3、立即完成当前动画，继续执行后续动画
$('div').stop(false,true)
//4、立即完成当前动画，并且停止后续所有的动画
$('div').stop(true，true)