Audio Player
Audio playback with "audio" label to achieve control of the audio
1 <audio src="http://www.ytmp3.cn/down/44456.mp3" controls="controls" align="center"> 2 </audio> 3 <h5>半城烟沙</h5> 4 <audio src="2.mp3" controls="controls"> 5 </audio> 6 </audio> 7 <h5>樱花草</h5> 8 <audio src="yinyue/1.mp3" controls="controls" loop="loop"> 9 </audio>
It has a src, controls, loop, perload, autoplay and other attributes.
- src is a necessary attribute of audio and writing music address
- controls is an important attribute of audio, it has suspended the progress bar and other features, Google's browser controls support download, the volume does not support scheduling, but Firefox support volume control does not support download
- loop property is set whether the cycle, with the loop attribute, this audio will loop
- autoplay autoplay property only after media loading is complete
- perload refers preload, none, metadata, auto properties are three options, none are not preloaded, metadata bytes only load element, auto loading all the
Video Player
Play video of "video" tag video with the same audio controls that attribute has video audio
1 <video width="500"higth="400" src="http://edge.ivideo.sina.com.cn/212550342.mp4?KID=sina,viask&Expires=1555776000&ssig=bkhlo665%2Bx"controls="controls"poster="images/1.jpg"></video>
Erro attribute error message:
when a playback error occurs in a video or audio, sends a Mediaerror object code property returns corresponding error code corresponding to the attribute, with the possible values:
User operation so terminated MeDIA_ERR_ABORTED (value 1) during download
MEDIA_ERR_NETWORE (numerical value 2) media resources are available, the process of downloading network error
MWDIA_ERR_DECODE (value 3 media resources are available, but when a decoding error
MWDIA_ERR_SRC_NOT_SUPPORTED (value 4) property is not available, or is not supported formats
read error status code as follows:
. 1 < srcipt > 2 var document.getElemenetById Video = ( "the Element Video"); . 3 video.addEventListener ( "error", function () . 4 { . 5 var error = video.eror; . 6 Switch (error.code) . 7 { . 8 . 1 Case: . 9 Alert ( "downloading video is operated terminated"); 10 BREAK; . 11 Case 2: 12 is Alert ( "network failure, video download termination"); 13 is BREAK; 14 Case. 3: 15 { 16 Alert ( "decoding error"); . 17 BREAK; 18 is } . 19 Case. 4: 20 is { 21 is Alert ( "does not support this format, the video error"); 22 is BREAK; 23 is } 24 default: 25 { 26 is Alert ( "occurs unknown error "); 27 } 28 } 29 }, to false); 30 </ Script >
network State attribute
for the network loading state detection process, not commonly used, is not described in detail
It has four return values:
- 0 represents an initial state
- 1 indicates that no network connection is established
- 2 represents the media Loading
- 3 indicates that no suitable coding without loading
embed
Scripts embedded embed and object are used on the page, used to play flash files
If you are using flash files or other video tag does not support the format. You can use the embed tag insertion.
embed tag only supports PC side, the mobile terminal is invalid, mobile and video tags support both the PC side, if your video is mp4 file format, it is recommended to use video labels, compatible PC and mobile sides.
We want normal display flash content in a Web page, the page must have a label flash path specified. That is OBJECT and EMBED tags
html5 embed tag is a new version of the label, it is defined using embedded content (e.g., plug-ins, media, etc.)
If the browser is not installed not enabled flash, then the browser will pop up a message box if access to automatically install flash player.
The difference between the object and embed:
for compatibility with different browsers, IE only supports parsing of the Object; Firefox, Google, Safari only supports the parsing of Embed. Note: Use <object>+ <embed>in order to better compatibility, if the scenario allows recommended <object>.
Syntax :
1 <embed src="/i/helloworld.swf" type="application/x-shockwave-flash" />
embed tag attribute values:
| Attribute sets | Explanation |
| src | Embedded content address |
| type | File embedded content type MIME type |
| autostart | Autoplay (boolean) |
| loop | Loop (boolean) |
| hidden | The control panel display (true, no) |
| starttime = mm: ss (minutes: seconds) | 开始播放的时间 |
| volume | 音量大小(0~100) |
| height、width | 容器属性 |
| units | 该属性指定高和宽的单位为pixels或en |
| controls=console | 一般正常面板(多属性值) |
| name | 该属性给对象取名，以便其他对象利用 |
| title= | 说明文字 |
| palette=color|color | 表示嵌入的音频或视频文件的前景色和背景色，第一个值为前景色，第二个值为背景色，中间用 | 隔开。color可以是RGB色（RRGGBB）也可以是颜色名 |
| align | 规定控制面板和当前行中的对象的对齐方式 |
embed支持很多媒体类型比如图像、音频、视频、可以参考文件类型（IANA MIME 类型）列表，说明：embed标签是一个空标签，没有元素内容。在html中可以不关闭标签，而在xhtml中必须使用“/”关闭标签，如：<embed />
MIME(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型。是设定某种扩展名的文件用一种应用程序来打开的方式类型，当该扩展名文件被访问的时候，浏览器会自动使用指定应用程序来打开。
常用的MIME类型：
| 文件后缀 | Mime类型 | 说明 |
| .flv | flv/flv-flash | 在线播放 |
| .html或.htm | text/html | 超文本标记语言文本 |
| .rtf | application/rtf | RTF文本 |
| .gif | image/gif | GIF图形 |
| .jpeg或.jpg | image/jpeg | JPEG图形 |
| .au | audio/basic | au声音文件 |
| .mid或.midi | audio/midi或audio/x-midi | MIDI音乐文件 |
| .ra或.ram或.rm | audio/x-pn-realaudio | RealAudio音乐文件 |
| .mpg或.mpeg或.mp3 | video/mpeg | MPEG文件 |
| .avi | video/x-msvideo | AVI文件 |
| .gz | application/x-gzip | GZIP文件 |
| .tar | application/x-tar | TAR文件 |
| .exe | application/octet-stream | 下载文件类型 |
| .rmvb | video/vnd.rn-realvideo | 在线播放 |
| .txt | text/plain | 普通文本 |
| .mrp | application/octet-stream | MRP文件（国内普遍的手机） |
| .ipa | application/iphone-package-archive | IPA文件(IPHONE) |
| .deb | application/x-debian-package-archive | DED文件(IPHONE) |
| .apk | application/vnd.android.package-archive | APK文件(安卓系统) |
| .cab | application/vnd.cab-com-archive | CAB文件(Windows Mobile) |
| .xap | application/x-silverlight-app | XAP文件(Windows Phone 7) |
| .sis | application/vnd.symbian.install-archive | SIS文件(symbian平台) |
| .jar | application/java-archive | JAR文件(JAVA平台手机通用格式) |
| .jad | text/vnd.sun.j2me.app-descriptor | JAD文件(JAVA平台手机通用格式) |
| .sisx | application/vnd.symbian.epoc/x-sisx-app | SISX文件(symbian平台) |
Object
object参数说明
param name标签是在这个播放插件中嵌入的一些功能和播放参数,比如（你可以抄下来）:
<param name="playcount" value="1"><!--控制重复次数: “x”为几重复播放几次; x=0，无限循环。-->
<param name="autostart" value="0"><!--控制播放方式: x=1，打开网页自动播放; x=0，按播放键播放。-->
<param name="clicktoplay" value="1"><!--控制播放开关: x=1，可鼠标点击控制播放或暂停状态; x=0，禁用此功能。-->
<param name="displaysize" value="0"><!--控制播放画面: x=0，原始大小; x=1，一半大小; x=2，2倍大小。-->
<param name="enablefullscreen controls" value="1"><!--控制切换全屏: x=1，允许切换为全屏; x=0，禁用此功能。-->
<param name="showaudio controls" value="1"><!--控制音量: x=1，允许调节音量; x=0，禁止音量调节。-->
<param name="enablecontext menu" value="1"><!--控制快捷菜单: x=1，允许使用右键菜单; x=0，禁用右键菜单。-->
<param name="showdisplay" value="1"><!--控制版权信息: x=1，显示电影及作者信息;x=0，不显示相关信息-->
<param NAME="AutoStart" VALUE="-1"><!--是否自动播放-->
<param NAME="Balance" VALUE="0"><!--调整左右声道平衡,同上面旧播放器代码-->
<param name="enabled" value="-1"><!--播放器是否可人为控制-->
<param NAME="EnableContextMenu" VALUE="-1"><!--是否启用上下文菜单-->
<param NAME="url" VALUE="http://1.wma"> <!--播放的文件地址--><param NAME="PlayCount" VALUE="1"><!--播放次数控制,为整数-->
<param name="rate" value="1"><!--播放速率控制,1为正常,允许小数,1.0-2.0-->
<param name="currentPosition" value="0"><!--控件设置:当前位置-->
<param name="currentMarker" value="0"><!--控件设置:当前标记-->
<param name="defaultFrame" value=""><!--显示默认框架-->
<param name="invokeURLs" value="0"><!--脚本命令设置:是否调用URL-->
<param name="baseURL" value=""><!--脚本命令设置:被调用的URL-->
<param name="stretchToFit" value="0"><!--是否按比例伸展-->
<param name="volume" value="50"><!--默认声音大小0%-100%,50则为50%-->
<param name="mute" value="0"><!--是否静音--
<param name="uiMode" value="mini"><!--播放器显示模式:Full显示全部;mini最简化;None不显示播放控制,只显示视频窗口;invisible全部不显示--><param name="windowlessVideo" value="0"><!--如果是0可以允许全屏,否则只能在窗口中查看-->
<param name="fullScreen" value="0"><!--开始播放是否自动全屏-->
<param name="enableErrorDialogs" value="-1"><!--是否启用错误提示报告-->
<param name="SAMIStyle" value><!--SAMI样式-->
<param name="SAMIFilename" value><!--字幕ID-->
使用 object 和 embed 标签来嵌入，细心的会发现，object 的很多参数和 embed 里面的很多属性是重复的，为什么这样做？为了浏览器兼容性，有的浏览器支持 object，有的支持 embed，这也是为什么要修改 Flash 的参数时两个地方都要改的原因。这种方法是 Macromedia 一直以来的官方方法，最大限度的保证了 Flash 的功能，没有兼容性问题。
现阶段用 JS 嵌入 Flash 是最完美的方法.
对于不支持object的浏览器，可以使用如下方式，浏览器将跳过object，识别embed元素：
<object width="400" height="40" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"> <param name="SRC" value="bookmark.swf"> <embed src="bookmark.swf" width="400" height="40"></embed> </object>
播放音频可使用object、embed，此外html5也有audio标签与video相对应，且用法相同。