Html 视频 object ,embed,video

简介: object 为html4 和html5共有的,embed,video 为html5新加的标签, object和embed支持几乎所有的格式视频,但object只有IE浏览器支持,其他浏览器大都支持embed 所以把embed嵌入object实现多浏览器兼容。 video只支持三种格式的视频。ogg,mpeg4,,, 所以大多数视频播放都采用object内嵌embed

object 为html4 和html5共有的,embed,video 为html5新加的标签,

object和embed支持几乎所有的格式视频,但object只有IE浏览器支持,其他浏览器大都支持embed

所以把embed嵌入object实现多浏览器兼容。

video只支持三种格式的视频。ogg,mpeg4,,,

所以大多数视频播放都采用object内嵌embed




/**  
*视频播放  
*参数说明  
u - 媒体URL  
w - 媒体宽度width  
h - 媒体高度height  
*/  


//播放Mediaplayer格式的视频,包括.avi .mpg .mpeg .wmv .wma .asf .mid .mp3等  
function pv_m(u, w, h){  
var pv='';  
pv += '<object width="'+w+'" height="'+h+'" id="iask_v" classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,5,715" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">';  
pv += '<param name="FileName" value="'+u+'">';  
pv += '<param name="AutoStart" value="1">';  
pv += '<param name="AutoSize" value="1">';  
pv += '<param name="ShowControls" value="1">';  
pv += '<param name="ShowPositionControls" value="0">';  
pv += '<param name="ShowAudioControls" value="1">';  
pv += '<param name="ShowTracker" value="1">';  
pv += '<param name="ShowDisplay" value="0">';  
pv += '<param name="ShowStatusBar" value="1">';  
pv += '<param name="ShowGotoBar" value="0">';  
pv += '<param name="ShowCaptioning" value="0">';  
pv += '<param name="PlayCount" value="1">';  
pv += '<param name="AnimationAtStart" value="0">';  
pv += '<param name="TransparentAtStart" value="0">';  
pv += '<param name="AllowScan" value="0">';  
pv += '<param name="EnableContextMenu" value="0">';  
pv += '<param name="ClickToPlay" value="0">';  
pv += '<param name="InvokeURLs" value="1">';  
pv += '<param name="DefaultFrame" value="">';  
pv += '<embed src="'+u+'" width="'+w+'" height="'+h+'" type="application/x-mplayer2" pluginspage="http://www.microsoft.com/isapi/redir.dll?prd=windows&;sbp=mediaplayer&ar=media&sba=plugin&" name="MediaPlayer" showcontrols="1" showpositioncontrols="0" showaudiocontrols="1" showtracker="1" showdisplay="0" showstatusbar="1" autosize="0" showgotobar="0" showcaptioning="0" autostart="1" autorewind="0" animationatstart="0" transparentatstart="0" allowscan="1" enablecontextmenu="1" clicktoplay="0" invokeurls="1" defaultframe=""></embed>';  
pv += '</object>';  
document.write(pv);  
}  


//播放Realplay格式的视频,包括.rm .ram .rmvb等  
function pv_r(u, w, h){  
var pv='';  
pv += '<object width="'+w+'" height="'+h+'" id="iask_v" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">';  
pv += '<param name="SRC" value="'+u+'">';  
pv += '<param name="AUTOSTART" value="1">';  
pv += '<param name="CONTROLS" value="Imagewindow,StatusBar,ControlPanel">';  
pv += '<param name="_ExtentX" value="18415">';  
pv += '<param name="_ExtentY" value="9102">';  
pv += '<param name="SHUFFLE" value="0">';  
pv += '<param name="PREFETCH" value="0">';  
pv += '<param name="NOLABELS" value="0">';  
pv += '<param name="CONSOLE" value="Clip1">';  
pv += '<param name="LOOP" value="0">';  
pv += '<param name="NUMLOOP" value="0">';  
pv += '<param name="CENTER" value="0">';  
pv += '<param name="MAINTAINASPECT" value="0">';  
pv += '<param name="BACKGROUNDCOLOR" value="#000000">';  
pv += '<embed src="'+u+'" width="'+w+'" height="'+h+'" type="audio/x-pn-realaudio-plugin" console="Clip1" controls="Imagewindow,StatusBar,ControlPanel" autostart="true">';  
pv += '</object>';  
document.write(pv);  
}  


//播放Quicktime格式的视频,包括.mov .amr .3gp等  
function pv_q(u, w, h){  
var pv='';  
pv += '<object width="'+w+'" height="'+h+'" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">';  
pv += '<param name="src" value="'+u+'">';  
pv += '<param name="controller" value="true">';  
pv += '<param name="type" value="video/quicktime">';  
pv += '<param name="autoplay" value="true">';  
pv += '<param name="target" value="myself">';  
pv += '<param name="bgcolor" value="black">';  
pv += '<param name="pluginspage" value="http://www.apple.com/quicktime/download/index.html">';  
pv += '<embed src="'+u+'" width="'+w+'" height="'+h+'" controller="true" align="middle" bgcolor="black" target="myself" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/index.html"></embed>';  
pv += '</object>';  
document.write(pv);  

目录
相关文章
|
Web App开发 数据采集 移动开发
提升Selenium在Chrome上的HTML5视频捕获效果的五个方法
在Selenium中优化Chrome的HTML5视频捕获涉及更新Chrome和ChromeDriver、配置浏览器选项、使用代理IP、调整加载策略及确保安装了正确编解码器。例如,更新驱动程序,添加如`--autoplay-policy`和`--proxy-server`的命令行参数,使用代理以防止被封,设置页面加载策略为&#39;eager&#39;,并安装必要的编解码器来确保视频播放。代码示例展示了如何集成这些优化措施。
495 2
提升Selenium在Chrome上的HTML5视频捕获效果的五个方法
|
移动开发 JavaScript 前端开发
HTML5 Video(视频)2
HTML5 `&lt;video&gt;` 标签及其相关属性和方法简介:支持 MP4、WebM 和 Ogg 视频格式。通过 JavaScript 控制播放、暂停、加载及设置属性如音量、尺寸等。示例展示了如何使用 `play()`、`pause()` 方法及 `paused`、`width` 属性创建基本的播放/暂停和调整尺寸控件。
|
Web App开发 移动开发 iOS开发
HTML5 Video(视频)1
HTML5引入了&lt;video&gt;元素,为网页视频播放提供标准方法。它支持播放、暂停和音量控制,以及视频尺寸设置。主要浏览器如IE9+、Firefox、Opera、Chrome和Safari均支持此元素。&lt;video&gt;元素可通过多个&lt;source&gt;子元素链接不同格式的视频文件,以确保兼容性。当前支持的视频格式包括MP4、WebM和Ogg。
|
移动开发 HTML5
在HTML5中嵌入视频和音频
【10月更文挑战第5天】在HTML5中嵌入视频和音频。
191 3
|
移动开发 编解码 监控
HTML5 Video(视频)作为背景的优化方案
使用 HTML5 `&lt;video&gt;` 标签作为网页背景视频可以提升视觉效果,但需优化以确保性能和用户体验。主要方法包括:选择合适的视频格式(MP4、WebM、Ogg)和分辨率(720p 或更低),压缩文件大小,确保视频静音和循环播放,使用 CSS 设置全屏样式,根据设备和网络条件加载视频或静态图像,使用 `playsinline` 属性和延迟加载技术提高性能,确保无障碍性,并监控页面加载时间。合理应用背景视频可增强网站视觉效果而不影响用户体验。
|
移动开发 编解码 前端开发
HTML5 <video>视频详解
HTML5引入了内置的`&lt;video&gt;`标签,简化了网页中视频的嵌入与播放。本文详细介绍了HTML5视频的基本语法、常用属性(如controls、autoplay等)、示例代码及使用注意事项,包括浏览器兼容性、跨域请求处理和响应式设计。通过JavaScript还可实现对视频播放的动态控制。掌握这些技巧,有助于提升网站的多媒体体验。
|
移动开发 开发者 UED
HTML5中video标签controlslist属性的使用方法
`controlsList`属性为开发者提供了更多控制HTML5视频播放器行为的能力,让视频内容的集成更加灵活和符合需求。通过精心设计的控制列表,可以提升用户体验,同时保持内容的安全性和专业性。这种细节的控制和定制能力是现代Web开发的一个重要方面,反映了HTML5对开发者和内容创作者需求的响应。
1188 1
|
移动开发 JavaScript 前端开发
html5 video
本文介绍了HTML5中的`<video>`标签的用法,包括如何设置视频的属性如自动播放、循环播放、加载模式,以及如何通过JavaScript控制视频播放和暂停,还提到了支持的视频格式和`<video>`标签中`<source>`元素的作用。
292 0
html5 video
矢泽妮可二次元html视频动态引导页源码
矢泽妮可二次元html视频动态引导页源码 源码由HTML+CSS+JS组成,记事本打开源码文件可以进行内容文字之类的修改,双击html文件可以本地运行效果,也可以上传到服务器里面,重定向这个界面
155 0
|
移动开发 前端开发 JavaScript
如何实时准确地从HTML5视频中截取当前播放画面
如何实时准确地从HTML5视频中截取当前播放画面
1618 5