object标签属性详解

最近在做视频直播这一块的，html5的video不能实现此功能，在网上查找了资料，觉得很有用。

一、介绍：我们要在网页中正常显示flash内容，那么页面中必须要有指定flash路径的标签。也就是OBJECT和EMBED标签。OBJECT标签是用于windows平台的IE浏览器的，而EMBED是用于windows和Macintosh平台下的Netscape Navigator浏览器以及Macintosh平台下的IE浏览器。windows平台的IE利用Activex控件来播放flash而其它的浏览器则使用Netscape插件技术来播放flash。下面是简单的网页中插入flash的代码示例：Code:<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"WIDTH="550" HEIGHT="400" id="myMovieName"><PARAM NAME=movie VALUE="myFlashMovie.swf"><PARAM NAME=quality VALUE=high><PARAM NAME=bgcolor VALUE=#FFFFFF><EMBED src="/support/flash/ts/documents/myFlashMovie.swf" quality=high bgcolor=#FFFFFF WIDTH="550" HEIGHT="400"NAME="myMovieName" ALIGN="" TYPE="application/x-shockwave-flash"PLUGINSPAGE="http://www.macromedia.com/Go/getflashplayer"></EMBED></OBJECT>二、为什么要使用以上全部的标签？能省略某些标签不？OBJECT标签是用于windows IE3.0及以后浏览器或者其它支持Activex控件的浏览器。“classid”和“codebase”属性必须要精确地按上例所示的写法写，它们告诉浏览器自动下载flash player的地址。如果你没有安装过flash player 那么IE3.0以后的浏览器会跳出一个提示框访问是否要自动安装flash player。当然，如果你不想让那些没有安装flash player的用户自动下载播放器，或许你可以省略掉这些代码。EMBED标签是用于Netscape Navigator2.0及以后的浏览器或其它支持Netscape插件的浏览器。“pluginspage”属性告诉浏览器下载flash player的地址，如果还没有安装flash player的话，用户安装完后需要重启浏览器才能正常使用。为了确保大多数浏览器能正常显示flash，你需要把EMBED标签嵌套放在OBJECT标签内，就如上面代码例子一样。支持Activex控件的浏览器将会忽略OBJECT标签内的EMBED标签。Netscape和使用插件的IE浏览器将只读取EMBED标签而不会识别OBJECT标签。也就是说，如果你省略了EMBED标签，那firefox就不能识别你的flash了（不过纳闷的是，省略了object只写embed，IE也能正常显示flash，呵呵，具体的再仔细看看了）。本文列出了用于发布影片的OBJECT和EMBED标签的必要以及可选属性。一、必需属性：·CLASSID-设置浏览器的Activex控件，仅用于OBJECT标签。·CODEBASE-设置flash Activex控件的位置，因而如果浏览器如果没有安装的话，可以自动下载安装。仅用于OBJECT标签。·WIDTH-以百分比或象素指定flash影片的宽度。·HEIGHT-以百分比或象素指定flash影片的高度。·SRC-指定影片的下载地址。仅用于EMBED标签。·PLUGINSPAGE-设置flash 插件的位置，因而如果浏览器如果没有安装的话，可以自动下载安装。仅用于EMBED标签。·MOVIE-指定影片的下载地址。仅用于OBJECT标签。二、可选属性及可用的值：·ID-设定变量名，用于脚本代码的引用。仅用于OBJECT。·NAME -设定变量名，用于脚本代码（如JavaScript）的引用。仅用于EMBED。·SWLIVECONNECT - （true或false）指定当flash player第一次下载时，是否启用Java。如果些属性省略，默认值为false。你果你在相同页同使用javascript和flash，java必须使用FSCommand来工作。·PLAY -（true或false）指定flash影片是否在下载完成后就自动播放，如果省略此属性，则默认为true。·LOOP - （true或false）指定影片播放完最后一帧后是停止还是继续循环播放，如果省略此属性，则默认为true。·MENU - （true或false）·True 显示全部的菜单，允许用户放大，缩小等控制影片播放等操作。·False 显示只包含设置选项和关于flash的菜单。·QUALITY - (low, high, autolow, autohigh, best )·Low 速度优于美观，而且不应用反锯齿。·Autolow 刚开始着重于速度，但当需要时随时提升美观。·Autohigh 同时着重播放速度和美观，但需要时则牺牲美观来保证播放速度。·Medium 应用一些反锯齿而不平滑位图。它质量高于low设置而低于high设置。·High 美观优于播放速度，而且一直应用反锯齿。如果影片不包含动画，位图会被平滑化;而如果影片包含动画，位图将不变平滑。·Best 提供最好的显示质量而不考虑播放速度。所有输出都应用反锯齿及所有位图都被平滑化。·SCALE - (showall, noborder, exactfit)·Default(Show all)影片在指定的区域内显示，但保持原始的比例。影片两侧将会出现边框。·No Boder 收缩影片以适合指定的区域，保持影片不失真，但部分影片将可能将裁切。然而保持影片的原始比例。·Exact Fit 使整个影片在指定的区域内显示，影片有可能变形失真，而且不保持原始的比例。·ALIGN - (l, t, r, b)·默认为居中，当浏览器窗口小于影片时，边缘会被裁切。·Left,Right,Top,Bottom按照相应的设置沿浏览器的边缘对齐。如果需要，另外三边将被裁切。·SALIGN - (l, t, r, b, tl, tr, bl, br)·L,R,T,B·TL,TR·BL,BR·WMODE- (window, opaque, transparent) 设置flash影片的window mode属性，指定flash在浏览器中的透明，层叠及位置。·Window 影片在浏览器中自己的矩形窗口内播放。·Opaque 影片隐藏了所有在它后面的内容。·Transparent 使flash影片透明，显示透明影片后面的网页内容。这将会降低动画的性能。而且这个属性不是在所有浏览器中都可用的。·BGCOLOR - （#RRGGBB, 十六进制RGB值。）指定影片的背景颜色。使用这个属性覆盖flash中设定的背景颜色。·BASE - 设定基准目录或URL，用来解决所以flash中的相对路径。类似网页中的<base>标签。·FLASHVARS 传递变量到flash player，需要flash player6及以后的版本。·传递root级变量到影片。字符串的格式是用“&”分隔的name=value集。·浏览器支持64kB大小的字符串长度。·更多关于FlashVars的信息，请查看相关文档。

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"
WIDTH="550" HEIGHT="400" id="myMovieName">
<PARAM NAME=movie VALUE="myFlashMovie.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="/support/flash/ts/documents/myFlashMovie.swf" quality=high bgcolor=#FFFFFF WIDTH="550" HEIGHT="400"
NAME="myMovieName" ALIGN="" TYPE="application/x-shockwave-flash"
PLUGINSPAGE="http://www.macromedia.com/Go/getflashplayer">
</EMBED>
</OBJECT>

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"
WIDTH="550" HEIGHT="400" id="myMovieName">
<PARAM NAME=movie VALUE="myFlashMovie.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="/support/flash/ts/documents/myFlashMovie.swf" quality=high bgcolor=#FFFFFF WIDTH="550" HEIGHT="400"
NAME="myMovieName" ALIGN="" TYPE="application/x-shockwave-flash"
PLUGINSPAGE="http://www.macromedia.com/Go/getflashplayer">
</EMBED>
</OBJECT>

三、我的案例

<div class="test"><!--[if IE]><object type='application/x-vlc-plugin' id='vlc' events='True'classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab" width="100%" height="100%"><param name='mrl' value='rtsp://192.168.2.110:18810//unicast' /><param name='volume' value='50' /><param name='autoplay' value='true' /><param name='loop' value='false' /><param name='fullscreen' value='true' /><param value="transparent" name="wmode"><param name='fullscreen' value='http://blog.csdn.net/WUAINIFU/article/details/false'/></object><![endif]--><!--[if !IE]><!--><object type='application/x-vlc-plugin' id='vlc' events='True' width="100%" height="100%" pluginspage="http://www.videolan.org" codebase="http://downloads.videolan.org/pub/videolan/vlc-webplugins/2.0.6/npapi-vlc-2.0.6.tar.xz"><param name='mrl' value='rtsp://192.168.2.110:18810/unicast' /><param name='volume' value='50' /><param name='autoplay' value='true' /><param name='loop' value='false' /><param name='fullscreen' value='true' /><param value="transparent" name="wmode"></object><!--<![endif]--></div>

另外补充几点我遇到的一些问题以及解决方法:

1.视频大小自适应问题，视频的宽度我们设的为100%，高度则采用js来控制的，我的视屏是16:9的比例，代码如下：

<script type="text/javascript">//设置视频播放器外部盒子高度function setHeight() {var $width1 = $(".test").width();var $height1 = $width1 * 0.5625;$(".video-list:nth-child(1) .test object").height($height1);} $(window).load(function(){setHeight();})/*监听窗口大小改变事件*/$(window).resize(function(){setHeight();})</script>

2.视频位于页面的最上层，会遮盖弹出层之类的，无论怎么设index都无效，解决的方法是：用iframe来解决。

object标签属性详解相关推荐

html frameset 属性,html frameset标签怎么用？html frameset标签属性详解
html frameset标签怎么用?html frameset标签属性详解,本篇文章主要讲述了html frameset标签的定义和用法,还有html frameset标签两个属性的用途(附实例) ...
audio标签的controls属性_HTML5教程 audio标签属性详解
本篇教程探讨了HTML5教程 audio标签属性详解,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 . < src:String型,所播放音频的 url. auto ...
Android 总结：Manifest文件中,application和activity标签属性详解
android:hasCode = ["true" | "false"] android:icon = "drawable resource" ...
php中li标签,li标签有哪些属性？css中li标签的属性详解
在html中,我们经常会遇到li标签,那么li标签有哪些属性?下面我们来了解一下css中li标签的属性. 一:标签有哪些属性在html中,使用css中li标签来控制样式,很多网站上都是点为开头,也有 ...
html5中preload是什么意思,html的video标签的preload属性详解
--------------------------------------------------------- Ta 只分享的内容开始 ------------------------------ ...
Vue项目使用symbol的方式引入svg图标和svg path大法d属性详解，section标签
symbol标签 svg path大法d属性详解 section标签
HTML embed标签使用方法和属性详解
HTML embed标签使用方法和属性详解一.基本语法代码如下: embed src=url 说明:embed可以用来插入各种多媒体,格式可以是 Midi.Wav.AIFF.AU.MP3等等,Ne ...
【input 标签的 type 属性详解】
input 标签的 type 属性详解 1. input 输入标签的 type 属性 1.1 input 标签的 type类型属性的常用属性值 ⑴ 单行文本框: type="text&qu ...
html中overflow是什么标签,CSS中Overflow的属性是什么？Overflow属性详解
很多人学习css的时候,不太知道Overflow的属性是什么?怎么用Overflow的属性,下面Gxlcms为你总结一下Overflow属性和用法. 我们都知道,盒子的大小和盒子的位置都是可以用css ...

object标签属性详解

object标签属性详解相关推荐

最新文章

热门文章