/**
* requestAnimationFrame兼容性扩展,两方面工作:
* 1、把各浏览器前缀进行统一
* 2、在浏览器没有requestAnimationFrame方法时将其指向setTimeout方法
* */
(function() {
var lastTime = 0;
var vendors = ["webkit", "moz"];
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x] + "RequestAnimationFrame"];
// Webkit中此取消方法的名字变了
window.cancelAnimationFrame = window[vendors[x] + "CancelAnimationFrame"] || 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. commonJS — 全局操作(for Window)

    for Window github: https://github.com/laixiangran/commonJS/blob/master/src/forWindow.js 代码 /** * Cre ...

  2. 利用requestAnimationFrame和Tween算法实现兼容所有浏览器的运动动画,直接秒杀Css3动画

    以下贴出Tween的代码: /* * Tween.js * t: current time(当前时间): * b: beginning value(初始值): * c: change in value ...

  3. ES5对Array增强的9个API

    为了更方便的对Array进行操作,ES5规范在Array的原型上新增了9个方法,分别是forEach.filter.map.reduce.reduceRight.some.every.indexOf ...

  4. ES5新特性:理解 Array 中增强的 9 个 API

    为了更方便的对JS中Array进行操作,ES5规范在Array的原型上新增了9个方法,分别是forEach.filter.map.reduce.reduceRight.some.every.index ...

  5. HTML5中类jQuery选择器querySelector的高级使用 document.querySelectorAll.bind(document);

    基本用法 querySelector 该方法返回满足条件的单个元素.按照深度优先和先序遍历的原则使用参数提供的CSS选择器在DOM进行查找,返回第一个满足条件的元素. ----> querySe ...

  6. 读书笔记 effective c++ Item 54 让你自己熟悉包括TR1在内的标准库

    1. C++0x的历史渊源 C++标准——也就是定义语言的文档和程序库——在1998被批准.在2003年,一个小的“修复bug”版本被发布.然而标准委员会仍然在继续他们的工作,一个“2.0版本”的C+ ...

  7. H5动画

    1.参考:http://blog.csdn.net/whqet/article/details/42911059?readlog https://developer.mozilla.org/zh-CN ...

  8. Apollo与ROS

    Apollo项目基于ROS,但是对其进行了改造,主要包括下面三个方面: 通信性能优化 去中心化网络拓扑 数据兼容性扩展 通信性能优化 自动驾驶车辆中包含了大量的传感器,这些传感器可能以非常高频的速度产 ...

  9. 动画优化、客户端存储、历史记录、worker

    一.requestAnimationFrame 1.requestAnimationFrame怎么用? 设置关键帧动画效果,注重关键帧执行的情况,用法与setTimeout一样 2.requestAn ...

随机推荐

  1. laravel 重写以及500错误

    http://www.golaravel.com/laravel/docs/5.1/ sudo chmod 755 -R laravel chmod -R o+w laravel/storage

  2. linux poll 学习

    一.poll介绍 函数原型: #include <poll.h> int poll(struct pollfd *fds, nfds_t nfds, int timeout); struc ...

  3. laravel框架总结(二) -- blade模板引擎

    ## 1.基本用法 ##情形1 $name = laravel5 <div class="title"> {{$name}} {{$name}}</div> ...

  4. 3-WebPack

    一. 什么是WebPack WebPack可以看做是模块加载.打包工具. 它所做的事情是 1.分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,Typ ...

  5. UIView如何管理它的子视图

    UIView提供了很多建立和管理视图的方法. 1.添加视图 insertSubview:atIndex:   //放在子视图数组的具体索引位置 insertSubview:aboveSubview:  ...

  6. .Net用户控件

    用户控件用户控件是个什么东西?自定义的反复重用的控件集合 好处?1.代码重用2.结构良好3.分工开发4.局部缓存 难点:一.交换信息: 注意信息的交换只在相邻层之间进行交换,如果是嵌套交换信息除Ses ...

  7. (1)创建一个叫做People的类: 属性:姓名、年龄、性别、身高 行为:说话、计算加法、改名 编写能为所有属性赋值的构造方法; (2)创建主类: 创建一个对象:名叫“张三”,性别“男”,年龄18岁,身高1.80; 让该对象调用成员方法: 说出“你好!” 计算23+45的值 将名字改为“李四”

    package a; public class People { private String name,sex; private int age; private double height; pu ...

  8. C#正则表达式获取组名,按照组名输出匹配内容

    最近写了个正则表达式匹配的工具,可以按照组名输出匹配内容,还是挺方便的,代码留存一下,以后用的话,直接copy了. Regex regex = new Regex(this.textBoxRegex. ...

  9. 关于float的说明

    关于float的说明     如图所示,蓝色的div和红色的div处于黑色的div(宽为500px)之中,其中蓝色的div设置了做浮动: 由图一(红色div的margin-top为10px,margi ...

  10. 各种编码中汉字所占字节数;中文字符集编码Unicode ,gb2312 , cp936 ,GBK,GB18030

    vim settings set fileencodings=utf-8,ucs-bom,gb18030,gbk,gb2312,cp936,latin1set termencoding=utf-8se ...