飞行射击类游戏很常用的追踪子弹，或者塔防里面固定炮台打 怪物的时候，为了保证子弹不会打空，追踪是必要的。
然而，这是极其简单的事情。
在每一帧里判断当前子弹和目标位置的距离和方向，不断修正 速度方向即可。

我们的图片大部分都是可以转换成 base64 编码的 data：image。 这个在将 canvas 保存为 img 的时候尤其有用。虽然除 ie 外，大部分现代浏览器都已经支持原生的基于 base64 的 encode 和 decode，例如 btoa 和 atob。（将 canvas 画布保存成 img 并强制改变 mimetype 进行下载，会在下一篇记录）

但是处于好奇心，还是驱使我去了解下 base64 编码的原理。以便也在不支持原生 base64 编码的 ie 下可以得以实现。

【已知】
canvas 提供了 toDataURL 的接口，可以方便的将 canvas 画布转化成 base64 编码的 image。目前支持的最好的是 png 格式，jpeg 格式的现代浏览器基本也支持，但是支持的不是很好。

这个工具的实现，是我长久以来的一个愿望，缘于之前看到的蓝色理想上的一个代码捕捉器。当时我下下来用了一下，没仔细研究，只觉得很难用，于是心底就有了一颗种子，希望有一天自己能开发出这样的工具。感谢伟大的谷歌，给了我一种优雅的实现方式——谷歌插件。

下面说说技术部分：

一开始用的是浏览器原生的 css rules，可是后来发现谷歌的 css rules 是经过解析的，而 ie 的不是。由于对谷歌的偏爱，所以不得不另辟蹊径。凑巧之前又看到了谷歌的另一个插件——Web Developer，可以把页面引用到的 css 文件内容都显示出来。于是，在控制台把代码复制了下来，考到了我的 js 里面。它的实现原理是用 ajax 请求把所有 css 文件内容给抓下来，这涉及到一个跨域问题。不过不用怕，我们是插件嘛，当然有特殊的权利——跨域 ajax 请求。

过去在网页上播放声音一般使用 wmp（windows media player）控件，但是 wmp 控件提供的 js 接口非常有限，更致命的是 IE only。如果不想接受 wmp 的界面，又或者想要跨平台，只能借助于 flash 了。现在 html5 标准已经原生支持音频播放，并且各大浏览器都不同程度地实现了。

关于团队合作的 css 命名规范

常用的 css 命名规则：

• 头：header
• 内容：content/container
• 尾：footer
• 导航：nav
• 侧栏：sidebar
• 栏目：column

文本溢出展示省略号的需求经常都会用到，而对于新式的浏览器，这完全不是问题，因为 css3 里面已经有实现 text-overflow：ellipsis，但是最新 w3c 文档中却移除了这个属性，即使这样，也有不少浏览器实现了这个特性。其浏览器支持情况如下：

可以看到，只有 firefox 和 opera11 一下的版本不支持这个浏览器，以此也可以放心大胆的用了。但是遇到要求高的产品经理时（╮(╯_╰)╭），就不得不考虑 firefox 等不支持的浏览器了，唯有使用 js 进行字符截断。

比较简单的截断方式就是按字符个数截断，以一个中文宽度等于两个英文宽度为前提，根据给定字符个数进行截取。但是字符在页面显示的时候，其宽度并不是一定的，会根据不同的字体和字体大小的不同而不同，更何况字母 i 和 A 的宽度是不一样的，存在 bug 且不够精确。