音视频

来源:互联网 发布:华为预装软件卸载 编辑:程序博客网 时间:2024/05/17 07:44
html中插入多媒体的标签有
H5支持的:
audio 音频
video 视频
-source; 为audio和video定义媒介资源,浏览器加载自己支持的那份
embed 嵌入内容
ps:W3C强调embed是H5的新标签,但是在以往的页面中都会使用embed标签,查了下资源,object最早是由MS引入用以支持ActiveX,但其他浏览器使用的是embed嵌入多媒体。embed以往虽然不是W3C规范,但是不少浏览器都支持,所以往往会在object中内嵌embed实现兼容目的。另外又有人说chrome和safari现在也支持object了。不过为了较好地兼容旧版本浏览器,还是object内嵌embed妥当。

<audio controls="controls" height="100"width="100">
  <source src="song.mp3"type="audio/mp3" />
  <source src="song.ogg"type="audio/ogg" />
<embed height="100" width="100" src="song.mp3"/>
</audio>

<video width="320" height="240"controls="controls">
  <source src="movie.mp4"type="video/mp4" />
  <source src="movie.ogg"type="video/ogg" />
  <source src="movie.webm"type="video/webm" />
  <object data="movie.mp4"width="320" height="240">
   <embed src="movie.swf" width="320" height="240"/>
  </object>
</video>


外援方式:
--雅虎媒体播放器
<a href="song.mp3">PlaySound</a>

<script type="text/javascript"src="http://mediaplayer.yahoo.com/js">
</script>

先将视频上传到优酷再copy视频链接html
<embedsrc="http://player.youku.com/player.php/sid/XMzI2NTc4NTMy/v.swf"
width="480" height="400"
type="application/x-shockwave-flash">
</embed>

H4支持的:
object和embed:
<object width="425"height="344">
   <param name="movie"value="http://player.youku.com/player.php/Type/Folder/Fid/19188186/Ob/1/sid/XNTQ3NDQyMTY4/v.swf"          />
   <param name="allowFullScreen" value="true"/>
   <param name="allowScirptaccess" value="always"/>
   <embedsrc="http://player.youku.com/player.php/Type/Folder/Fid/19188186/Ob/1/sid/XNTQ3NDQyMTY4/v.swf"quality="high"          width="480"height="400" align="middle" allowFullScreen="true"mode="transparent"type="application/x-shockwave-flash">
   </embed>
</object>


param标签为object提供状态/功能参数,下边是网友摘录的一些常用参数:

<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"><!--播放的文件地址--><paramNAME="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全部不显示--><paramname="windowlessVideo"value="0"><!--如果是0可以允许全屏,否则只能在窗口中查看-->
<param name="fullScreen"value="0"><!--开始播放是否自动全屏-->
<param name="enableErrorDialogs"value="-1"><!--是否启用错误提示报告-->
<param name="SAMIStyle"value><!--SAMI样式-->
<param name="SAMIFilename"value><!--字幕ID-->

最后,关于插入flash,不少网友在博客中都推荐JS嵌入Flash.
SWFObject.js下载地址:
https://github.com/swfobject/swfobject
http://code.google.com/p/swfobjec
embedSWF五个参数分别表示Flash地址、
的id、宽度、高度、播放器最低版本。