当前位置: 代码迷 >> Web前端 >> 当代浏览器下的动画实现
  详细解决方案

当代浏览器下的动画实现

热度:85   发布时间:2013-09-25 11:02:58.0
现代浏览器下的动画实现

要在浏览器下实现动画,有几个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();//启动定时器


  相关解决方案