<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" Content="text/html; charset=UTF-8" />
<meta name=keywords Content="html5">
<title>example1 input forms </title>
<script type="text/javascript">
function failed(e) {
// video playback failed - show a message saying why
switch (e.target.error.code) {
case e.target.error.MEDIA_ERR_ABORTED:
alert('You aborted the video playback.');
break;
case e.target.error.MEDIA_ERR_NETWORK:
alert('A network error caused the video download to fail part-way.');
break;
case e.target.error.MEDIA_ERR_DECODE:
alert('The video playback was aborted due to a corruption problem or because the video used features your browser did not support.');
break;
case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
alert('The video could not be loaded, either because the server or network failed or because the format is not supported.');
break;
default:
alert('An unknown error occurred.');
break;
}
}
function fallback(video) {
// replace <video> with its contents
while (video.hasChildNodes()) {
if (video.firstChild instanceof HTMLSourceElement)
video.removeChild(video.firstChild);
else
video.parentNode.insertBefore(video.firstChild, video);
}
video.parentNode.removeChild(video);
}
</script>
</head>
<body>
<audio src="1.mp4" controls onerror="failed(event)">
Your browser doesn't support the audio tag
</video>
<video src="video.avi" controls onerror="failed(event)">
Your browser doesn't not support video tag
</video>
<audio controls="controls">
<source src="1.mp4">
<source src="2.mp4" onerror="fallback(parentNode)">
Your browser doesn't support the audio tag
</audio>
</body>
</html>
浏览器对音频格式的支持:
格式 | IE 9 | Firefox 3.5 | Opera 10.5 | Chrome 3.0 | Safari 3.0 |
Ogg Vorbis | | √ | √ | √ | |
MP3 | √ | | | √ | √ |
Wav | | √ | √ | | √ |
浏览器对视频格式的支持:
格式 | IE | Firefox | Opera | Chrome | Safari |
Ogg | No | 3.5+ | 10.5+ | 5.0+ | No |
MPEG 4 | 9.0+ | No | No | 5.0+ | 3.0+ |
WebM | No | 4.0+ | 10.6+ | 6.0+ | No |
分享到:
相关推荐
If you embed audio or video in your website, you should use HTML5.
HTML5新增加的audio和video标签让我们增加了很多惊喜,可以让我们更方便的在网页中播放音频和视频。但目前很多浏览器不支持,无法在旧版的IE浏览器中使用。html5media.min.js却是一个能让这两个标签在各种新旧版IE...
浏览器HTML5标签video和audio支持 包含其相应支持的格式
HTML5 AudioVideo 标签,属性,方法,事件
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
3.2 使用html5 audio和video api 56 3.2.1 浏览器支持性检测 57 3.2.2 理解媒体元素 58 3.2.3 使用audio元素 62 3.2.4 使用video元素 63 3.2.5 进阶功能 68 3.3 小结 70 第4章 geolocation api 72 4.1 位置...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
A jQuery plugin, jPlayer allows you to rapidly weave cross platform audio and video into your web pages. jPlayer's comprehensive API allows you to create innovative media solutions while support and ...
4.1.3 HTML5 Audio和Video的限制 77 4.1.4 audio元素和video元素的浏览器支持情况 77 4.2 使用HTML5 Audio和Video API 78 4.2.1 浏览器支持性检测 79 4.2.2 可访问性 79 4.2.3 理解媒体元素 80 4.2.4 使用...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
作为HTML5和WebSocket的狂热爱好者,Peter常常在国际大会上发言,还在全球范围内开展HTML5的技术培训。在加盟Kaazing前,Peter在Oracle担任了近十年的资深信息架构师,获得过两项软件专利。 Brian Albers Kaazing...
简单的html5 audio和video标签的用法,还不错哦,供小白参考
html5入门代码大全(源码) 包含audio、video、canvas 、communication、forms、geolocation、intro、offline、storage、websocket、workers
audio_video_marquee_05.html
CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件 1:把video文件复制到ckeditor/plugins/下面 2:ckeditor/config.js 中添加如下: a:在toolbar中['Image','Flash','Video'],配置加入“Video” 项。 b:配置 ...