分類  >  Web前端 >

當代瀏覽器下的動畫實現

tags:    時間:2013-12-10 00:07:17
現代瀏覽器下的動畫實現

要在瀏覽器下實現動畫,有幾個JS的Lib不得不提:

1) requestAnimationFrame,利用現代瀏覽器介面提供比setTimer和setInterval更高效的計時器(timer)。當然不兼容的瀏覽器,將還是使用setTimeout。

2)  Tween.js,類似AS中的Tween類,可以高效處理DOM元素渲染計算。適用於2D動畫特效。

3)  three.js,提供給現代瀏覽器3D功能的支持,當然還有攝像頭,聲頻等功能支持。適用於3D動畫特效,瀏覽器兼容問題較嚴重。

4) stats.js,提供FPS計算。

其中2,3和4,都需要結合requestAnimationFrame來提供計算效率。

大致的流程如下:

function init(){ //初始化相關元素

}

function animate(){
        requestAnimationFrame( animate ); //定時器
        update();

}

function update(){//每幀動畫執行

}

init();//啟動初始化

animate();//啟動定時器


推薦閱讀文章

Bookmark the permalink ,來源:互聯網