requestAnimationFrame是比setInterval更高效更平滑的动画实现。
兼容性查看:http://caniuse.mojijs.com/Home/Html/item/key/requestanimationframe/index.html
MDN文档:https://developer.mozilla.org/zh-CN/docs/Web/API/Window/requestAnimationFrame
原文链接:https://www.paulirish.com/2011/requestanimationframe-for-smart-animating/ 1 // requestAnimationFrame实现浏览器兼容的代码
window.requestAnimFrame = (function(){
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
function( callback ){
window.setTimeout(callback, 1000 / 60);
};
})(); // 使用方法:
// 代替 setInterval(render, 16) .... (function animloop(){
requestAnimFrame(animloop);
render();
})();

requestAnimationFrame实现浏览器兼容的更多相关文章

  1. CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  2. CSS-各种cs样式之浏览器兼容处理方式汇总大全(更新中...)

    页面模板 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 ...

  3. 浅谈CSS hack(浏览器兼容)

    今天简单写一点关于浏览器兼容的处理方法,虽然百度上已经有很多,但是我还是要写! 先看一个图 这个图描述了2016年1月至8月网民们所使用的浏览器市场份额(来源:http://tongji.baidu. ...

  4. jQuery-1.9.1源码分析系列(七) 钩子(hooks)机制及浏览器兼容

    处理浏览器兼容问题实际上不是jQuery的精髓,毕竟让技术员想方设法取弥补浏览器的过错从而使得代码乱七八糟不是个好事.一些特殊情况的处理,完全实在浪费浏览器的性能:突兀的兼容解决使得的代码看起来既不美 ...

  5. 【跟着子迟品 underscore】for ... in 存在的浏览器兼容问题你造吗

    Why underscore 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. 阅读一些著名框架类库的源码,就好像和一个个大师对 ...

  6. 浏览器兼容innerText nextElementSibling firstElementChild

    //下面是封装的方法,可以直接使用 //获dom对象的innerText的取值 function getInnerText(element){ //判断浏览器是否支持innerText if(type ...

  7. web前端~~浏览器兼容问题(百度)

    所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的 ...

  8. 关于浏览器兼容问题及hack写法

    浏览器的兼容问题 1.浏览器内核: Mozilla Firefox ( Gecko ) Internet Explorer ( Trident ) Opera ( Presto ) Safari ( ...

  9. 转:【总结】浏览器CSS Hacks汇总,浏览器兼容方式CSS Hacks

    [总结]浏览器CSS Hacks汇总   浏览器兼容可以说是前端开发所要面对的第一个挑战,目前我的电脑上已经安装了6种浏览器(基于IE内核的不算,如Maxthon等). CSS hacks利用浏览器的 ...

随机推荐

  1. 2017 Multi-University Training Contest - Team 2 &&hdu 6053 TrickGCD

    TrickGCD Time Limit: 5000/2500 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others)Total ...

  2. POJ - 3281 Dining(拆点+最大网络流)

    Dining Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 18230   Accepted: 8132 Descripti ...

  3. 洛谷 P3128 [ USACO15DEC ] 最大流Max Flow —— 树上差分

    题目:https://www.luogu.org/problemnew/show/P3128 倍增求 lca 也写错了活该第一次惨WA. 代码如下: #include<iostream> ...

  4. 插入1000万条数据到mysql数据库表

    转自:https://www.cnblogs.com/fanwencong/p/5765136.html 我用到的数据库为,mysql数据库5.7版本的 1.首先自己准备好数据库表 其实我在插入100 ...

  5. GROUPPING和ROLLUP的基本知识

    1.GROUPPING 是一个聚合函数,它产生一个附加的列,当用 CUBE 或 ROLLUP 运算符添加行时,附加的列输出值为1,当所添加的行不是由 CUBE 或 ROLLUP 产生时,附加列值为0. ...

  6. B - Eleven

    Problem description Eleven wants to choose a new name for herself. As a bunch of geeks, her friends ...

  7. 自学Python九 爬虫实战二(美图福利)

    作为一个新世纪有思想有文化有道德时刻准备着的屌丝男青年,在现在这样一个社会中,心疼我大慢播抵制大百度的前提下,没事儿上上网逛逛YY看看斗鱼翻翻美女图片那是必不可少的,可是美图虽多翻页费劲!今天我们就搞 ...

  8. SQL学习--Select(一)TOP、派生表、连接、谓词

    TOP关键字 WITH TIES t.title,sum(s.qty)as totalSales from sales s left join titles t on s.title_id=t.tit ...

  9. 【java基础】(2)Java父类与子类的 内存引用讲解

    从对象的内存角度来理解试试.假设现在有一个父类Father,它里面的变量需要占用1M内存.有一个它的子类Son,它里面的变量需要占用0.5M内存.现在通过代码来看看内存的分配情况:Father f = ...

  10. 前端-git思维导图笔记

    命令汇总 git config配置本地仓库 常用git config --global user.name.git config --global user.email git config --li ...