js中动画原理
现如今，许多页面上均有一些动画效果。适当的动画效果可以在一定程度上提高页面的美观度，具有提示效果的动画可以增强页面的易用性。 实现页面动画的途径一般有两种。 一种是通过操作JavaScript间接操作CSS样式，每隔一段时间更新一次； 一种是直接通过CSS定义动画。第二种方法在CSS3成熟之后被广泛采用。 我们今天只讲第一种实现方式。 一、JavaScript中动画原理 所谓的动画，就是通过一些列的运动形成的动的画面。在网页中，我们可以通过不断的改变元素的css值，来达到动的效果。 JavaScript的动画用的最多的3个api就是setInterval()、setTimeout()和requestAnimationFrame() 据说，普通人眼能看到1/24秒，就是说1秒至少24帧，每次移位间隔需要小于1000/24=41.7毫秒，也就说setInterval要每隔至少40毫秒执行一次，一般地，我们采用10毫秒，当然间隔时间越短，客户端执行计算次数就越多，如果你code计算量大则可以适当调长些。 1.1 setTimeout()和setInterval () 1.2 requestAnimationFrame(回调函数) 像setTimeout、setInterval一样，requestAnimationFrame是一个全局函数