[译]视区百分比,canvas.toBlob()以及WebRTC
本文讲几个Firefox Nightly中的新特性.
视区百分比长度
Gecko现在支持了新的长度单位: vh, vw, vmin, vmax. 1vh就是视区高度的1%,而且该长度单位并不依赖于它的容器的尺寸.这样我们就可以构建一个直接和页面大小成比例的区域(比如HTML幻灯片,可以在不同的页面大小下显示相同的外观).
- vh
- 视区高度的1/100.
- vw
- 视区宽度的1/100th.
- vmin
- 视区高度和宽度之间最小值的1/100.
- vmax
- 视区高度和宽度之间最大值的1/100.
了解更多相关知识:CSS视区百分比长度(MDN).
<canvas>.toBlob()
Blob对象类似于File对象,包含了文件的原始数据,且是不可变的.Blob对象可以用在许多不同的API上,比如File API和IndexedDB.我们可以通过window.URL.createObjectURL创建一个指向某个Blob对象的别名.可以用它在许多情况下代替Data URI的功能(更节约内存).
现在,canvas元素可以使用toBlob()方法将图片内容导出成为一个图片类型的Blob对象了(替换了原先非标准的mozGetAsFile方法).toBlob方法是异步的:
toBlob(callback, type) //type默认值为"image/png"
了解更多相关知识:获取canvas所包含的图片文件(MDN).
译者注:我写了一个拼接大图的例子(Firefox Only),你可以拼接几张大图,体验一下Blob比DataURI快多少.注意:toBlob方法是异步的,所以浏览器会阻止在回调函数中用open打开的弹窗.
WebRTC,支持版本:Firefox Nightly (Firefox 19)和Firefox Aurora (Firefox 18)
首先需要激活WebRTC功能,修改about:config中的media.peerconnection.enabled选项为true.MDN上有更多关于WebRTC的文档,我们以后还会在Mozilla Hacks发布关于WebRTC的文章.
另外,如果你想保持关注Firefox最新添加的功能,可以在Twitter上粉我们@FirefoxNightly.
