原理 浏览器（如页面）每次要洗澡（重绘），就会通知我(requestAnimationFrame)，而 setTimeout 貌似是多个独立绘制。 作用 统一的向下兼容策略 CSS3 实现动画即高效又方便，但是对于 PC 浏览器，IE10+ CSS3 实现，IE9-之流 JS setTimeout 实现，实现方式也是不统一，但是 requestAnimationFrame 跟 setTimeout 非常类似，都是单回调 为了统一代码，需要对 IE9-的浏览器做下兼容性处理 简单的兼容（IE… »

Chrome 和 Safari 浏览器 preventDefault 报 treated as passive 错误 其实这个问题出现有一段时间了，主要麻烦的是，以前没有，后来，Chrome 和 Safari 浏览器升级了，然后出现这个错误，而且就在一个月前，Chrome 浏览器还只是黄色的警告，现在直接就红色错误献上。 例如，随便新建一个空白页面，写上如下 JavaScript 代码： 然后在移动端模式下页面上点击滑来滑去记下，就可以看到一大堆错误： Intervention Unable… »

canvas 实现弹幕性能较好 从技术实现成本角度讲，要实现弹幕效果，最简单的方法就是 DOM+CSS3 控制，如果我们的弹幕效果比较简单，使用 CSS3 动画实现也不失为一个好的方法。 但是如果我们的弹幕数据量比较大，就像下面这种： 使用 DOM 来实现很容易卡成了 80 年代的拖拉机——一顿一顿的。 很显然，面对这种多元素的复杂动画，使用 canvas 实现是更加合适的，动画会流畅很多。 本文就将展示两个案例，使用 canvas… »

简介 Pointer Lock API 可以让你的鼠标无限移动，脱离浏览器窗体的限制！ API 3 个属性 Document.pointerLockElement Document.onpointerlockchange Document.onpointerlockerror 2 个方法 Element.requestPointerLock() Document.exitPointerLock() 2 个事件 pointerlockchange pointerlockerror 其中，… »

HTML 与文件下载 如果希望在前端侧直接触发某些资源的下载，最方便快捷的方法就是使用 HTML5 原生的 download 属性，例如： 但显然，如果纯粹利用 HTML 属性来实现文件的下载（而不是浏览器打开或浏览），对于动态内容，就无能为力。 例如，我们对页面进行分享的时候，希望分享图片是页面内容的实时截图，此时，这个图片就是动态的，纯 HTML 显然是无法满足我们的需求的，借助 JS 和其它一些 HTML5 特性，例如，将页面元素转换到 canvas… »