如何在html中播放本地视频文件【兼容ie、火狐、谷歌、360浏览器等】

本文主要是介绍如何在html中播放本地视频文件【兼容ie、火狐、谷歌、360浏览器等】,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

 

 查询资料会发现,有的说用object标签,有的用embed标签,其实都是对的。只是针对的情况不一样,前者主要适用ie浏览器,后者用于火狐谷歌等其他浏览器。

<object> 标签用于包含对象,比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash。

embed标签定义嵌入的内容,比如插件。

object和embed的区别:1、是为了兼容不同浏览器,IE只支持对Object的解析;火狐,谷歌,Safari只支持对Embed的解析。2、object标签用clsid表示控件的唯一id,而embed标签用type表示插件的唯一名称。比如flash插件type为:application/x-shockwave-flash,mp3播放插件type为audio/mpeg。3、为了兼容多个浏览器,可以通过ie浏览器动态加载Object标签,非ie浏览器动态加载embed标签;或者在object标签里面嵌入embed标签。

html文件代码如下:
<body bgcolor=#000000><p align=center><object id="mPlayer1" width="600" height="800" classid="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6">
<param name="URL" value="D:\viedo.mp4"/><param name="rate" value="1"/><param name="balance" value="0"/><param name="currentPosition" value="0"/><param name="defaultFrame" value/><param name="playCount" value="0"/><param name="autoStart" value="1"/><param name="currentMarker" value="0"/><param name="invokeURLs" value="1"/><param name="baseURL" value/><param name="volume" value="100"/><param name="mute" value="0"/><param name="uiMode" value="full"/><param name="stretchToFit" value="0"/><param name="windowlessVideo" value="0"/><param name="enabled" value="1"/><param name="enableContextMenu" value="1"/><param name="fullScreen" value="0"/><param name="SAMIStyle" value/><param name="SAMILang" value/><param name="SAMIFilename" value/><param name="captioningID" value/><param name="enableErrorDialogs" value="0"/><param name="_cx" value="7779"/><param name="_cy" value="1693"/><embed src="D:\viedo.mp4" width="600" height="800"/></object>
</p></body>

 

封面图片设置:

<img title="test" src="video/images/index_v.png" onclick="window.open('video/index.html')" width="460" height="220">

 

这篇关于如何在html中播放本地视频文件【兼容ie、火狐、谷歌、360浏览器等】的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1136610

相关文章

vue解决子组件样式覆盖问题scoped deep

《vue解决子组件样式覆盖问题scopeddeep》文章主要介绍了在Vue项目中处理全局样式和局部样式的方法,包括使用scoped属性和深度选择器(/deep/)来覆盖子组件的样式,作者建议所有组件... 目录前言scoped分析deep分析使用总结所有组件必须加scoped父组件覆盖子组件使用deep前言

VUE动态绑定class类的三种常用方式及适用场景详解

《VUE动态绑定class类的三种常用方式及适用场景详解》文章介绍了在实际开发中动态绑定class的三种常见情况及其解决方案,包括根据不同的返回值渲染不同的class样式、给模块添加基础样式以及根据设... 目录前言1.动态选择class样式(对象添加:情景一)2.动态添加一个class样式(字符串添加:情

springboot 加载本地jar到maven的实现方法

《springboot加载本地jar到maven的实现方法》如何在SpringBoot项目中加载本地jar到Maven本地仓库,使用Maven的install-file目标来实现,本文结合实例代码给... 在Spring Boothttp://www.chinasem.cn项目中,如果你想要加载一个本地的ja

使用JavaScript操作本地存储

《使用JavaScript操作本地存储》这篇文章主要为大家详细介绍了JavaScript中操作本地存储的相关知识,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以参考一下... 目录本地存储:localStorage 和 sessionStorage基本使用方法1. localStorage

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用

使用Vue.js报错:ReferenceError: “Vue is not defined“ 的原因与解决方案

《使用Vue.js报错:ReferenceError:“Vueisnotdefined“的原因与解决方案》在前端开发中,ReferenceError:Vueisnotdefined是一个常见... 目录一、错误描述二、错误成因分析三、解决方案1. 检查 vue.js 的引入方式2. 验证 npm 安装3.

vue如何监听对象或者数组某个属性的变化详解

《vue如何监听对象或者数组某个属性的变化详解》这篇文章主要给大家介绍了关于vue如何监听对象或者数组某个属性的变化,在Vue.js中可以通过watch监听属性变化并动态修改其他属性的值,watch通... 目录前言用watch监听深度监听使用计算属性watch和计算属性的区别在vue 3中使用watchE

python解析HTML并提取span标签中的文本

《python解析HTML并提取span标签中的文本》在网页开发和数据抓取过程中,我们经常需要从HTML页面中提取信息,尤其是span元素中的文本,span标签是一个行内元素,通常用于包装一小段文本或... 目录一、安装相关依赖二、html 页面结构三、使用 BeautifulSoup javascript

Nacos客户端本地缓存和故障转移方式

《Nacos客户端本地缓存和故障转移方式》Nacos客户端在从Server获得服务时,若出现故障,会通过ServiceInfoHolder和FailoverReactor进行故障转移,ServiceI... 目录1. ServiceInfoHolder本地缓存目录2. FailoverReactorinit

Vue3 的 shallowRef 和 shallowReactive:优化性能

大家对 Vue3 的 ref 和 reactive 都很熟悉,那么对 shallowRef 和 shallowReactive 是否了解呢? 在编程和数据结构中,“shallow”(浅层)通常指对数据结构的最外层进行操作,而不递归地处理其内部或嵌套的数据。这种处理方式关注的是数据结构的第一层属性或元素,而忽略更深层次的嵌套内容。 1. 浅层与深层的对比 1.1 浅层(Shallow) 定义