1驳规、卷動(dòng)動(dòng)畫(huà):
slideup()----------(卷動(dòng))
slidedown()-------(滑動(dòng))
slidetoggle()-------(slideUp和 slideDown之間的切換)
<script>
$(function () {
$('button').eq(0).click(function () {
$('div').slideDown(1000)
})
$('button').eq(1).click(function () {
$('div').slideUp(1000)
})
$('button').eq(2).click(function () {
$('div').stop().slideToggle(1000)
})
})
</script>
2忠售、普通動(dòng)畫(huà)
show()-------(顯示動(dòng)畫(huà))
hide()--------(隱藏動(dòng)畫(huà))
toggle()------(show()和hide()之間的切換)
<script>
$(function(){
$('button').eq(0).click(function () {
$('div').show(1000)
})
})
$(function(){
$('button').eq(1).click(function () {
$('div').hide(1000)
})
})
$(function(){
$('button').eq(2).click(function () {
$('div').toggle(1000)
})
})
</script>
3、自定義動(dòng)畫(huà)
animate()------(固定數(shù)值)
animate()------(數(shù)字自加)
animate()------(設(shè)置toggle)
<script>
$(function () {
$('button').eq(0).click(function () {
$('div').animate({
width:300,
height:300
},1000)
})
$('button').eq(1).click(function () {
$('div').animate({
width:'+=100',
height:'+=100'
},1000)
})
$('button').eq(2).click(function () {
$('div').animate({
width:'toggle',
height:'toggle'
},1000)
})
})
</script>
4卓舵、淡入淡出
fadein()-------------(淡入)
fadeout()------------(淡出)
fadetoggle()--------(切換)
<script>
$('button').eq(0).click(function () {
$('div').fadeIn(3000)
})
$('button').eq(1).click(function () {
$('div').fadeOut(3000)
})
$('button').eq(2).click(function () {
$('div').fadeToggle(3000)
})
</script>