首先字面理解,请求动画框架,

用法:

  1. var nextFrame = (function() {
    return window.requestAnimationFrame ||
    window.webkitRequestAnimationFrame ||
    window.mozRequestAnimationFrame ||
    window.oRequestAnimationFrame ||
    window.msRequestAnimationFrame ||
    function(callback) { return setTimeout(callback, 1); };
    })();
    nextFrame(loop);
    loop是动画
    例子:
    loop:function(){
  1. defaults.origin+=defaults.Vx;
    con.style["-webkit-transform"]="translateY("+defaults.origin+"px)"
    defaults.origin<=-51?self.noop():nextFrame(self.back)
  2.  
  3. }
    它的作用是什么?相当于我不知道浏览器绘制时间,所以我请求浏览器根据它自身绘制时间来执行这个动画,
    对比css3优势,一切css3可以表现的,他都可以实现,css3不可以实现的它也可以实现

关于requestanimationframe的更多相关文章

  1. 动画requestAnimationFrame

    前言 在研究canvas的2D pixi.js库的时候,其动画的刷新都用requestAnimationFrame替代了setTimeout 或 setInterval 但是jQuery中还是采用了s ...

  2. 深入理解定时器系列——被誉为神器的requestAnimationFrame

    与setTimeout和setInterval不同,requestAnimationFrame不需要设置时间间隔.这有什么好处呢?为什么requestAnimationFrame被称为神器呢?本文将详 ...

  3. 我的前端故事----疯狂倒计时(requestAnimationFrame)

    很久没有更新博客了...为了双十一准备了不少活动,终于结束了,有时间静静的坐下来总结一下了,在活动中最常用的就是倒计时了,晚上也有很多倒计时的例子了,那么今天带来的是一个新的方法和思路. 既然要介绍新 ...

  4. 深入理解定时器系列第二篇——被誉为神器的requestAnimationFrame

    × 目录 [1]引入 [2]特点 [3]使用[4]兼容[5]应用 前面的话 与setTimeout和setInterval不同,requestAnimationFrame不需要设置时间间隔.这有什么好 ...

  5. requestAnimationFrame,Web中写动画的另一种选择

    HTML5/CSS3时代,我们要在web里做动画选择其实已经很多了: 你可以用CSS3的animattion+keyframes; 你也可以用css3的transition; 你还可以用通过在canv ...

  6. 大熊君学习html5系列之------requestAnimationFrame(实现动画的另一种方案)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  7. requestAnimationFrame与setInterval,setTimeout

    自打学习canvas动画以来,都说requestAnimationFrame好,就一直用,也没觉得有什么太过于特殊的地方,直到刚才,在写完前面的"小球碰撞墙壁----干掉误差"之后 ...

  8. HTML5探秘:用requestAnimationFrame优化Web动画

    本文转载自: HTML5探秘:用requestAnimationFrame优化Web动画

  9. 使用requestAnimationFrame做动画效果二

    3月是个好日子,渐渐地开始忙起来了,我做事还是不够细心,加上感冒,没精神,今天差点又出事了,做过的事情还是要检查一遍才行,哎呀. 使用requestAnimationFrame做动画,我做了很久,终于 ...

  10. 使用requestAnimationFrame做动画效果一

    最近学习了requestAnimationFrame,看了张鑫旭直白易懂,但是某些地方语言过于裸露的文章http://www.zhangxinxu.com/wordpress/2013/09/css3 ...

随机推荐

  1. 【TOJ 1072】编辑距离(动态规划)

    描述 假设字符串的基本操作仅为:删除一个字符.插入一个字符和将一个字符修改成另一个字符这三种操作. 我们把进行了一次上述三种操作的任意一种操作称为进行了一步字符基本操作. 下面我们定义两个字符串的编辑 ...

  2. svn配置教程

    检查svn是否安装rpm -aq subversion如果没有安装yum安装yum install -y subversion 建立svn版本数据库存储根目录mkdir -p /application ...

  3. java 一个数字的位数不够怎么在前面加0

    import java.text.DecimalFormat; //(1).如果数字1是字符串,如下处理: String str1="1"; DecimalFormat df=ne ...

  4. 【oracle的安装和基本配置】

    /*----------------------------登录和安装--------------------------------------*/ #从官网上选择安装的版本,任何一个版本都可以,目 ...

  5. scala (8) 模糊匹配

    object MatchDemo { /** * 定义偏函数用PartialFunction来表示 * PartialFunction[T1,T2]要求传入一个参数T1,T2代表返回的类型. * 偏函 ...

  6. sqlserver之group by 与over函数

    group by 函数主要用来对数据进行分组,over()函数则是一个“开窗函数”,它更多的是与聚合函数如:sum().max().min().avg().count()等函数以及排名函数如:row_ ...

  7. shiro实战整合

    引入依赖(包括缓存等): <!-- SECURITY begin --> <dependency> <groupId>org.apache.shiro</gr ...

  8. 20155217 2016-2017-2《Java程序设计》课程总结

    20155217 2016-2017-2<Java程序设计>课程总结 每周作业链接汇总 预备作业一:我所期望的师生关系 预备作业二:c与java的关系 预备作业三:安装虚拟机 第一周作业: ...

  9. 20155315 2017-05-10 《Java程序设计》课堂代码检查

    一.教材代码检查-p98 代码要求 修改教材P98 Score2.java, 让执行结果数组填充是自己的学号 代码链接 运行结果截图 二.在IDEA中以TDD的方式对String类和Arrays类进行 ...

  10. VBox&vmware虚拟机安装Linux及Linux基础入门学习

    VBox&vmware虚拟机安装Linux及Linux基础入门学习 通过VMware workstation安装Linux 在安装虚拟机之前,我特意上网搜索了一下目前常使用的虚拟机软件,了解了 ...