html5 audio js控制进度,HTML5多媒体的之audio和video。JavaScript控制进度条播放进度

使用HTML5多媒体，audio和video两个元素可以让用户不必借助flash player插件即可播放音频和视频。

小知识：视频文件包含了音频轨道，视频轨道和其他一些元数据。当我们播放视频的时候，音频轨道和和视频轨道是绑定在一起同步播放的。元数据部分包含了视频的封面，标题，子标题，字幕等相关信息。

一.使用audio元素

HTML5中的audio是用来播放声音文件的，支持ogg Vorbis , MP3,Wav等音频格式

用法如下：

您的浏览器不支持audio

效果图中，可以播放，可以暂停，可以调音量甚至可以静音，也可以观看到进度条的进展，甚至可以下载该文件。

HTML5的video元素是用来播放视频文件的，支持Ogg,MPEG4,WebM等视频格式。

效果图：

效果图中，可以播放，可以暂停，可以全屏，也可以观看到进度条的进展，甚至可以下载该文件。

两个案例里都有controls属性，

controls属性：用于提供播放，暂停和音量控件，也可以包含宽度和高度属性。

以上的音频和视频的代码虽然非常的简单粗暴，但是美中不足的是不能通过进度条来调控时间，不过我相信以后的HTML5是会改进的，会更加的牛逼，在多媒体这方面，我相信以后会有新的改进。

以下的代码是通过JavaScript来控制进度条的，它可以实现视频的进度：

HTML5-Video-Player

border:1px solid #000;

width:600px;

}

#video{

margin-top