简单兼容:

window.requestAnimFrame = (function(){
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
function( callback ){
window.setTimeout(callback, 1000 / 60);
};
})();

  

但是呢,并不是所有设备的绘制时间间隔是1000/60 ms, 以及上面并木有cancel相关方法,所以,就有下面这份更全面的兼容方法:

(function() {
var lastTime = 0;
var vendors = ['webkit', 'moz'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || // Webkit中此取消方法的名字变了
window[vendors[x] + 'CancelRequestAnimationFrame'];
} if (!window.requestAnimationFrame) {
window.requestAnimationFrame = function(callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16.7 - (currTime - lastTime));
var id = window.setTimeout(function() {
callback(currTime + timeToCall);
}, timeToCall);
lastTime = currTime + timeToCall;
return id;
};
}
if (!window.cancelAnimationFrame) {
window.cancelAnimationFrame = function(id) {
clearTimeout(id);
};
}
}());

  

requestAnimationFrame 兼容不同浏览器的更多相关文章

  1. CSS兼容各浏览器的hack

    CSS兼容各浏览器的hack:建议:尽可能的手写代码,可以有效的提高学习效率和深度.浏览器的种类多,麻烦自然也多,主要是各种浏览器对某些属性的渲染效果并不相同,所以有时候需要专门针对特定浏览器或者特定 ...

  2. 【原】CSS实现背景透明,文字不透明,兼容所有浏览器

    11.11是公司成立的日子,16岁啦,我呢3岁半,感谢公司给了这样一个平台,让我得以学习和成长,这里祝愿公司发展越来越好~ 进入主题,每年11月11号是光棍节,产生于校园,本来只是一流传于年轻人的娱乐 ...

  3. JS获取回车事件(兼容各浏览器)

    一.用到onkeydown获取事件动作, 二.用到键盘对应代码keyCode, 三. var event=arguments.callee.caller.arguments[0]||window.ev ...

  4. CSS实现背景透明,文字不透明,兼容所有浏览器

    11.11是公司成立的日子,16岁啦,我呢3岁半,感谢公司给了这样一个平台,让我得以学习和成长,这里祝愿公司发展越来越好~ 进入主题,每年11月11号是光棍节,产生于校园,本来只是一流传于年轻人的娱乐 ...

  5. 前台JS(type=‘file’)读取本地文件的内容,兼容各种浏览器

    [自己测了下,能兼容各种浏览器,但是读取中文会出现乱码.自己的解决方法是用notepad++把txt文件编码改为utf-8(应该是和浏览器编码保持一致吧?..)] 原文  http://blog.cs ...

  6. 【转】让Bootstrap 3兼容IE8浏览器

    FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个 ...

  7. 【转】向HTML中插入视频并兼容所有浏览器的方法

    原文地址:http://www.jb51.net/web/168548.html 向HTML中插入视频有两种方法,一种是古老的object标签,一种是html5中的video标签,前者兼容性相对好些, ...

  8. 让Bootstrap 3兼容IE8浏览器

    最近在研究Bootstrap(官方,Github)这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单.按钮 ...

  9. 兼容所有浏览器的设为首页收藏本站js代码

    大家发现传统的收藏本站按钮在360浏览器下面没有效果了,但是360浏览器用户群却非常之大.所以我们在网上找到一个兼容所有浏览器的收藏本站解决方案,具体功能如下: 设为首页 和 收藏本站js代码 兼容I ...

随机推荐

  1. python之SQLAlchemy组件

    介绍 SQLAlchemy 是一个 ORM 框架,可以帮助我们使用面向对象的方式快速实现数据库操作. 组成部分: Engine,框架的引擎 Connection Pooling ,数据库连接池 Dia ...

  2. [LeetCode] 33. Search in Rotated Sorted Array_Medium tag: Binary Search

    Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. (i.e. ...

  3. Docker:Docker machine(5)

    Docker machine Docker Machine的安全集成在Docker Toolbox中,是用户在Windows环境下使用docker并管理VirtualBox的一个终端: docker- ...

  4. JavaBean-EL-JSTL-MVC

    JavaBean规范 类必须使用public修饰     必须保证有公共无参数构造器.  (一般就是可以通过反射轻松的创建对象)  包含了属性的操作(给属性赋值,获取属性值). JavaBean中的成 ...

  5. WxWidgets笔记

    关于环境变量的配置:解压wxwidgets的压缩包之后要新建名为 WXWIN 的环境变量,变量的值为 解压得到的目录,不知为何要使用此环境变量 编译时使用的命令:mingw32-make -j1 -f ...

  6. C++重载操作符自增自减

    #include <iostream> using namespace std; class Test { friend ostream& operator<<(ost ...

  7. Eureka 参数调优

    常见问题 为什么服务下线了,Eureka Server 接口返回的信息还会存在. 为什么服务上线了,Eureka Client 不能及时获取到. 为什么有时候会出现如下提示: EMERGENCY! E ...

  8. Java当出现未被捕获的异常应该如何处理

    在你学习在程序中处理异常之前,看一看如果你不处理它们会有什么情况发生是很有好处的.下面的小程序包括一个故意导致被零除错误的表达式.class Exc0 {    public static void ...

  9. Lua 求当前月份的最大天数

    [1]实现代码 -- 第一种方式:简写 , day = })) print('The first way result : dayAmount = ' .. dayAmount) -- 第二种方式:分 ...

  10. Win10问题

    WIN10去除我的电脑上面的6个文件夹 把下面代码复制,保存到.reg中,然后执行即可(修改注册表文件.reg) Windows Registry Editor Version 5.00 ;如需还原去 ...