一.jq动画基础
1.显示和隐藏 (默认无动画,当添加参数的时候会有动画)
show()/hide() 显示和隐藏,括号内可以传递参数,fase,normal,slow (200ms,400ms,600ms)
$('#d1').click(function(){
$('div').hide('fast')
})
toggle() 根据当前状态显示或隐藏(当有这个的时候隐藏,无的时候显示)
2.滑动
slideDown():向下展开
slideUp():向上拉收起来
3.渐变
fadeIn(): 淡入
fadeOut(): 浅出
4.自定义动画
animate(样式,时间,结束后的状态)
$('#d1').click(function(){
$('div').animate({
'width':'300px',
'height':'300px'
},3000,function(){
$('div').css({
'width':'100px',
'height':'100px'
})
})
})
5.stop() 停止动画
stop(true,true)可以带参数
参数1:是否立即停止动画,true为立即停止
参数2:执行完当前动画,再停止其他动画
网友评论