動(dòng)畫的種類

閃現(xiàn)
勻速
緩動(dòng)

動(dòng)畫原理

盒子的位置 = 盒子本身所在的位置+步長。

緩動(dòng)動(dòng)畫

三個(gè)函數(shù)

Math.ceil() 向上取整
Math.floor() 向下取整
Math.round() 四舍五入

緩動(dòng)動(dòng)畫原理

leader=leader+(target-leader)/10;
盒子位置=盒子本身位置+（目標(biāo)位置-盒子本身位置）/10

動(dòng)畫原理 = 盒子位置 + 步長（步長越來越?。?/p>

體驗(yàn)緩動(dòng)動(dòng)畫

    var btn=document.getElementsByTagName("button")[0];
            var box=document.getElementsByTagName("div")[0];
            btn.onclick=function(){
                setInterval(function(){
                    box.style.left=box.offsetLeft+(400-box.offsetLeft)/10+"px"
                },30)
            }

offsetLeft和style.left的值的獲取問題

獲取盒子距離左側(cè)具有定位的父盒子的距離（沒有body），四舍五入取整
Style.left獲取的是具體值（賦值的時(shí)候也是直接賦值）