動(dòng)畫實(shí)際上就是在一定時(shí)間內(nèi)，改變一個(gè)元素的某些屬性。

這里簡單實(shí)現(xiàn)一個(gè)JavaScript運(yùn)動(dòng)的框架。主要包括：

  1. 速度動(dòng)畫（改變left、right、width、height、opacity）

  2. 緩沖運(yùn)動(dòng)

  3. 多物體運(yùn)動(dòng)

  4. 任意屬性值改變

  5. 鏈?zhǔn)竭\(yùn)動(dòng)

  6. 多屬性同時(shí)變化

速度動(dòng)畫

速度動(dòng)畫就是通過改變left、right、width、height、opacity的值來達(dá)到動(dòng)畫效果。我們先寫一個(gè)簡單的HTML結(jié)構(gòu)：

<div id="div1">
    <span id="share">分享</span></div>

具體CSS樣式效果如下圖：