1. 程式人生 > >jQuery中animate()動畫效果的實現

jQuery中animate()動畫效果的實現

$(function () {
     $("#box").animate({top:500,left:400},3000).delay(2000); //花3秒的時間從初始位置漂移到指定位置 $("#box").animate({top:0,left:800},3000); //延遲兩秒後又花3秒的時間從漂移到第二個指定位置 $("#box").animate({height:400,width:400,top:100,left:200},3000); animate中的height 和width屬性代表動畫的過程中高寬會變成所設定的值, top和left代表動畫最終的位置離頂部100px,離左邊200px }) 注意: /*  #box{
 border: #ff1708 solid 1px;width: 200px;height: 200px;position: absolute;  //必須給box指定position: absolute;或者pisiton:relative
 //如果不指定那麼動畫效果只會對height和width有效,對top button left right 都不會有效
 //如果指定的是absolute,那麼動畫效果會相對於其父級進行變化,若沒有父級,則相對於body進行變化
 //如果指定的是relative,那麼動畫效果會相對於自身進行變化  }*/