[译]HTML5:video.playbackRate以及download属性

原文:https://hacks.mozilla.org/2012/12/firefox-development-highlights-video-playbackrate-download-attribute/

---

本文要讲两个Firefox Nightly(20)的新特性.

video元素支持自定义播放速率

通过改变video.playbackRate属性的值可以改变视频的播放速率.1.0是正常播放速度,2.0就两倍快的播放速度.下面的介绍引用自MDN HTMLMediaElement:

playbackRate属性可以控制媒体的播放速率.1.0是"正常速度",小于1.0的值会让媒体播放得比正常速度慢,反之变快.

代码示例:

<video src="v.webm" id="v" controls autoplay></video>
<button onclick="fastForward()">fast foward</button>
<script>
  fastFoward() {
    v.playbackRate = 2;
  }
</script>

Chrome也已经实现了这个属性,演示:

当前播放速率:1.0

a元素支持"download"属性

下面的介绍引用自HTML5规范草案:

为了表明一个资源是让用户下载的,而不是立即显示的,可以给a元素或area元素添加download属性来创建一个能下载该资源的超链接.

该属性最适合和Blob配合使用.有了Blob,你可以使用JavaScript创建文件.一个二进制blob文件可以是一个用canvas元素生成的图片.将blob URL(使用URL构造器生成)设置为a元素的链接并且给这个a元素指定download属性,然后通过点击这个链接,用户就能把对应的blob文件下载到它们的硬盘上.

下面的代码示例来自于Tom Schuste(他在Nightly中实现了download属性)的文章:

var blob = new Blob(["Hello World"]);
var a = document.createElement("a");
a.href = window.URL.createObjectURL(blob);
a.download = "hello-world.txt";
a.textContent = "Download Hello World!";

HTML5Rocks上也有一篇文章:Downloading resources in HTML5,Chrome去年就实现了这个属性.

演示: