IE9使用video.js兼容video标签播放视频（含Demo以及资源）

最新推荐文章于 2024-04-19 14:27:57 发布
最新推荐文章于 2024-04-19 14:27:57 发布
阅读量9.5k 收藏 9
点赞数
分类专栏： JavaScript 文章标签： video video.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_31201781/article/details/81450046
版权

资源文件地址

外站下载链接

liveDemo

LiveDemo
在这里插入图片描述

步骤

一、必要的文件

  1. video.min.js：video.js的主要库文件
  2. videojs-ie8.min.js： 兼容IE9的video标签所需要的文件，在video的5.8版本里可以找到
  3. video-js.min.css ：样式
  4. video-js.swf：兼容IE9所需。当IE9时，MP4等会转为swf文件用flash进行播放。

二、demo

    <!DOCTYPE html>
    <html lang="zh_CN">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link href="video-js.min.css" rel="stylesheet">
        <script src="videojs-ie8.min.js"></script>
        <script src="video.min.js"></script>
        <script type="text/javascript">
          videojs.options.flash.swf = 'video-js.swf'
        </script>
    
    </head>
    <body>
    <video id="video_id" class="video-js vjs-default-skin" controls="controls" preload="none" autoplay="autoplay" data-setup="{}">
        <source id="source_id" src="QQ20180802094835.mp4" type="video/mp4">
    </video>
    <video src="QQ20180802094835.mp4" controls preload></video>
    </body>
    </html>

<script type="text/javascript"> videojs.options.flash.swf = 'video-js.swf' </script>

执笔看墨花开
关注
  • 0
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 27
    评论
专栏目录
html5视频播放器代码调用实例(视频切换\倍速切换)
05-18 2418
本文将对视频播放相关的功能进行说明，包括初始化播放器、播放器尺寸设置、视频切换、倍速切换、视频预览、自定义视频播放的开始/结束时间、禁止拖拽进度、播放器皮肤、控件按钮以及播放控制等。
亲测可用。IE8下播放mp4格式的视频
09-18
经测完全可用。ie8 下播放mp4 ，在尝试过许多的方法后终于可以在IE8中播放MP4格式的视频了
vue flvjs 播放视频
最新发布
在职可交流前端开发，包括：web端、uniapp等，欢迎指教。
04-19 866
之前使用过vodiejs插件播放过mp4视频格式的视频；此次需要使用flvjs插件播放rtsp视频格式的视频；因为视频的数据格式不同，所以对应的插件不同。思维导图：
video.js 在ie8 上的兼容demo（附 html5media）
11-07
网页嵌入视频播放，用HTML5 video.js ,由于IE兼容性问题用了开源插件html5media，亲试可用
springboot + vue3实现视频播放Demo（video.js & Vue3-video-play视频播放器）
pscool的博客
05-12 5118
当一个视频文件过大时，不可能一次性的将整个视频的文件流全部写给前端。所以需要用到ffmpeg，将视频按时间分割成ts文件，ts文件比较小，因此浏览器就可以请求这个ts文件，ffmpeg在将视频分割成ts文件时，还会生成一个.m3u8的文件，它相当于与是这些分割的ts文件的一个索引，所以前端只要拿到这个索引文件，并且根据这个索引文件去拿ts文件来做播放。只是实现了个视频播放的demo，至于还有些问题，没深入都能拿到这个m3u8文件的话，那岂不是所有人都能访问，前端如何和后端做认证或加密什么的。
video.js 兼容ie8 的demo
11-01
ie8 不支持html5，在网上找了好多资料测试才找到可以行的通的方法，这里做了一个demo亲测可用
HTML5视频播放插件 video.js介绍
12-14
很适合在移动端播放视频(比如微信网页)，功能强大，且支持降级到flash,兼容ie8。官网：http://videojs.com/ git&demo ：http://files.cnblogs.com/files/stoneniqiu/video-js-5.11.4.zip 看下默认例子： controls...
VideoJs 视频JS包及演示Demo
10-09
本资源包含VideoJs的包文件以及一个经过优化的演示Demo，允许你在本地直接运行播放视频。 ### 1. VideoJs简介 VideoJs是一个强大的跨浏览器、跨设备的JavaScript和CSS库，用于构建用户友好的、交互式的HTML5视频...
video.js插件
06-16
- **播放统计**：如 `videojs-playback-rate`，提供播放速度控制。 - **全屏控制**：如 `videojs-fullscreen`，增强全屏功能。 - **画布增强**：如 `videojs-resolution-switcher`，允许用户选择视频质量。 开发者...
ie8中html显示视频,怎么让IE8支持html5中的video标签
weixin_42098830的博客
06-17 456
Html5 Video是现在html5最流行的功能之一,得到了大多数最新版本的浏览器支持.包括IE9,也是如此.不同的浏览器提供了不同的原生态浏览器视频空间.我们制作自定义视频控件为了在所有的浏览器中有一个相同的Html5视频控件而不受默认视频控件的控制.实际上,自定义视频控件并不困难.本文将告诉你如何用jQuery自定义视频控件,希望对你有用!DEMO DOWNLOADHTML5 Vide...
video-js 播放器demo
06-01
video js代码 ，加入视频即可播放。 一个html5的播放器。 在ie9以下会自动转flash播放。
videojs-ie8.min.js
01-02
支持ie8的视频播放软件！！！！！！！！！！！！！！！！！！！
ie8 mp4 player
03-16
经测完全可用。ie8 下播放mp4
使用video.js或原生事件统计视频观看时长
10-12
使用video.js和原生事件实现了两版视频统计时长，并且支持网络卡顿时暂停统计时长，重新播放时可以继续统计时长的功能，兼容性比较强，可根据实际再进行调整，基本原生事件都可以实现相关时长统计且误差很小，还可以支持多视频分别统计时长。
IE8下视频不能播放（video）
铦鹞
06-19 388
引入html5media.min.js(js只引用该文件，其余文件和该文件一个文件夹) 转存失败重新上传取消
IE8下实现视频播放
热门推荐
孤城幻夜
11-28 1万+
首先需要下载vidoe.js文件，在页面(test.html)中引用：<!DOCTYPE HTML> <html> <head> <title>TEST</title> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <link rel="stylesh
vue 使用 video.js 播放 m3u8 视频流
大家好，我是 ed.
08-25 3147
vue 使用 video.js 播放 m3u8 视频流 首先呢，遇到一个项目，是需要使用播放器在web上播放视频流，项目使用vue开发的，然后就找了一下相应的插件，找到了 video.js，自己用的时候感觉还不错，可以满足自己的需求，记录一下。 安装依赖包 npm install video.js --save // 视频播放器插件 npm install videojs-contrib-hls --save // 播放hls流插件 npm install @videojs/http-streaming
html播放视频代码兼容IE/谷歌浏览器
yuli001123的专栏
05-25 1629
这个得记录下来，老忘掉！ 关于flash的插入： OBJECT标签是用于windows IE3.0及以后浏览器或者其它支持Activex控件的浏览器。“classid”和“codebase”属性必须要精确地按上例所示的写法写，它们告诉浏览器自动下载flash player的地址。如果你没有安装过flash player 那么IE3.0以后的浏览器会跳出一个提示框访问是否要自动安装...
vue使用video.js播放视频
12-28
在Vue项目中使用video.js播放视频，可以按照以下步骤进行： 1. 首先，安装video.js和video.js的CSS样式文件。可以使用npm或者yarn进行安装： ```shell npm install video.js npm install video.js/dist/video-js.css ``` 2. 在Vue项目的入口文件（例如main.js）中，引入video.js和video.js的CSS样式文件，并将video.js注册到Vue的原型上： ```javascript import Vue from 'vue' import Video from 'video.js' import 'video.js/dist/video-js.css' Vue.prototype.$video = Video ``` 3. 在需要使用video.js播放视频的组件中，可以通过`this.$video`来访问video.js的功能。例如，在一个视频播放组件中，可以使用以下代码来初始化和播放视频： ```javascript export default { mounted() { // 获取video标签 const videoElement = this.$refs.video // 使用video.js初始化视频 const player = this.$video(videoElement) // 设置视频源 player.src('path/to/video.mp4') // 播放视频 player.play() } } ``` 请注意，上述代码中的`$refs.video`是一个ref属性，用于获取video标签的DOM元素。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 27
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值