API接口

Window对象定义了以下两个接口:

partial interface Window {
long requestAnimationFrame(FrameRequestCallback callback);
void cancelAnimationFrame(long handle);
};

1、执行requestAnimationFrame之后再执行cancelAnimationFrame。

下面代码只会执行一次a:

var id = null;

    function a(time) {
console.log("animation");
id = window.requestAnimationFrame(a);
window.cancelAnimationFrame(id);
} a();

2、在callback外部执行cancelAnimationFrame。 下面代码只会执行一次a

function a(time) {
console.log("animation");
id = window.requestAnimationFrame(a);
} a();
window.cancelAnimationFrame(id);

requestAnimationFrame 与 cancelAnimationFrame的更多相关文章

  1. 关于requestAnimationFrame()和cancelAnimationFrame()与定时器之间的比较

    在渲染页面动画的时候,其实也没有必要用定时器(setInterval),其实requestAnimationFrame()和cancelAnimationFrame()也能达到相应的效果,他是HTML ...

  2. requestAnimationFrame/cancelAnimationFrame——性能更好的js动画实现方式

    用js来实现动画,我们一般是借助setTimeout或setInterval这两个函数,css3动画出来后,我们又可以使用css3来实现动画了,而且性能和流畅度也得到了很大的提升.但是css3动画还是 ...

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

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

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

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

  5. requestAnimationFrame与setInterval,setTimeout

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

  6. requestAnimationFrame

    (function() { var lastTime = 0; var vendors = ['webkit', 'moz']; for(var x = 0; x < vendors.lengt ...

  7. 性能更好的js动画实现方式——requestAnimationFrame

    用js来实现动画,我们一般是借助setTimeout或setInterval这两个函数,css3动画出来后,我们又可以使用css3来实现动画了,而且性能和流畅度也得到了很大的提升.但是css3动画还是 ...

  8. requestAnimationFrame制作动画:旋转风车

    在以往,我们在网页上制作动画效果的时候,如果是用javascript实现,一般都是通过定时器和间隔来实现的,出现HTML5之后,我们还可以用CSS3 的transitions和animations很方 ...

  9. 记一次动画的优化--requestAnimationFrame、webp

    需要写一个类似帧动画的东西,但是每一帧是一张全屏的图,而且量特别大,600都张,而且存在跳帧的问题,只有把速度调的很快还可以看着不跳帧.但是只用谷歌还真正常播放. 其实优化起来两个方面.一个是用req ...

随机推荐

  1. .net:easyui-datagrid清空表中原有数据

    $("#StudentTable").datagrid("loadData", { total: 0, rows: [] });

  2. cdojQ - 昊昊爱运动 II

    地址:http://acm.uestc.edu.cn/#/contest/show/95 题目: Q - 昊昊爱运动 II Time Limit: 3000/1000MS (Java/Others) ...

  3. vue-scroller的使用

    一 安装 使用npm 安装 npm install vue-scroller -S 二 引入 https://www.jianshu.com/p/a39f5276ff0b https://www.np ...

  4. angularJs十个面试题

    一.ng-show/ng-hide 与 ng-if的区别? 我们都知道ng-show/ng-hide实际上是通过display来进行隐藏和显示的.而ng-if实际上控制dom节点的增删除来实现的.因此 ...

  5. sql中null 和 ‘’(空字符串)

    sql 中 null  和 空字符串的区别方式 在Silverlight中  数据库 需要与实体类进行映射, 假如实体类不允许为null,则 select '' as 列名  from  表名字:   ...

  6. IIS DirectoryEntry

    DirectoryEntry是.Net给我们的一大礼物,他的名字我们就知道他的功能--目录入口.使用过ADSI的人都知道操作IIS,WinNT这些时,我们还需要提供他们的Path,操作IIS时,这个P ...

  7. Apache 配置参数

    参数说明 1.Global Environment 全局环境配置,决定Apache服务器的全局参数3.Virtual Hosts—虚拟主机,虚拟主机不能与Main Server主服务器共存,当启用了虚 ...

  8. Autofac register and resolve

    Passing Parameters to Register When you register components you have the ability to provide a set of ...

  9. UNIDAC的安装

    UNIDAC的安装1.在source目录中找到对应Delphi版本目录的make.bat文件,修改其中的 set IdeDir="D:\Application\DelphiXE2指到你的de ...

  10. 织梦导航 currentstyle 点击li添加class类 样式

    <!--导航开始--> <div class="global_nav_wrap"> <ul class="nav nav-pills&quo ...