videojs兼容ie8
从网上找到很多这个videojs兼容ie8的解决方案,一个一个的试,最后发现没有一个是靠谱的。我好无奈啊……
先看图(ie上访问必须是线上地址)
看代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>video兼容</title>
<!--<link href="css/video-js.css" rel="stylesheet">-->
<link rel="stylesheet" href="http://vjs.zencdn.net/5.8.8/video-js.css" />
<script src="js/jquery-2.1.3.min.js"></script>
<!-- If you'd like to support IE8 -->
<script src="js/videojs/videojs-ie8.js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="js/videojs/html5.js"></script>
<![endif]-->
<script src="js/videojs/video.js"></script>
<style type="text/css">
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{
display:block;
}
.videos_container{
width:650px;
}
</style>
</head> <body>
<section class="videos_container">
<video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered" src="http://www.w3school.com.cn/example/html5/mov_bbb.mp4" controls preload="auto" width="640" height="264" poster="img/confident.jpg" data-setup="{}">
<source src='http://www.w3school.com.cn/example/html5/mov_bbb.mp4' type='video/mp4'></source>
<source src='videos/popin.webm' type='video/webm'></source>
<!-- <source src='videos/popin.ogg' type='video/ogg'></source> -->
<object id="flash_fallback_1" class="vjs-flash-fallback" width="640" height="264" type="application/x-shockwave-flash" data="js/videojs/flowplayer.swf">
<param name="movie" value="js/videojs/flowplayer.swf" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value='config={"playlist":["img/confident.jpg", {"url": "http://www.w3school.com.cn/example/html5/mov_bbb.mp4","autoPlay":false,"autoBuffering":true}]}' />
<img src="img/confident.jpg" width="280" height="210" alt="Poster Image" title="No video playback capabilities." />
</object>
</video>
</section> <script type="text/javascript">
$(function(){
videojs.options.flash.swf = "js/videojs/video-js.swf";
});
</script>
</body>
</body>
</html>
css本地样式文件在ie8上显示不正常,找了一个线上地址,显示正常了;
视频地址本地的视频加载出错,也是找了个线上地址放过去就好了,我不知道是因为啥原因。
参考链接:http://www.cnblogs.com/PheonixHkbxoic/p/5941543.html
所有代码文件地址:https://pan.baidu.com/s/1c19NcCo
videojs兼容ie8的更多相关文章
- 如何使用videojs兼容IE8浏览器
需要在服务器下运行 首先我们需要下载videojs包 https://github.com/videojs/video.js/releases 这里简单写了一个小栗子 <!DOCTYPE htm ...
- 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能
当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.ap ...
- jQuery validate兼容IE8写法
最近做项目的时候遇到一个validate插件在IE8下面点击submit按钮没有执行检查的BUG 在chrome和FF,还有IE9以上都可以.百度了好多文章都没有找到解决方法,后面自己测试找到了问题. ...
- 兼容ie8 rgba()用法
今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 但是要兼容到 ...
- 【转】让Bootstrap 3兼容IE8浏览器
FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个 ...
- 让Bootstrap 3兼容IE8浏览器
最近在研究Bootstrap(官方,Github)这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单.按钮 ...
- css样式设置图片半透明度,兼容IE8,火狐
关于背景颜色透明的兼容浏览器的问题,一直是个问题,我所写的兼容IE8,和火狐,说是兼容所有浏览器我就没有测试,有兴趣的朋友可以自己测试下吧. background-color:white;filter ...
- 兼容ie8 rgba()用法 滤镜filter的用法
原文 http://blog.csdn.net/westernranger/article/details/40836861 今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不 ...
- bootstrap3 兼容IE8浏览器
近期在使用bootstrap这个优秀的前端框架,这个框架非常强大,框架里面有下拉菜单.按钮组.按钮下拉菜单.导航.导航条.面包屑.分页.排版.缩略图.警告对话框.进度条.媒体对象等,bootstrap ...
随机推荐
- Python 字符串、列表和元组用法详解
1.通用函数 len() #列表的元素个数.字符串的长度 2.''' '''与'\ '用法详解 s='''this is a text ''' -->输出s ---> 'this\nis\ ...
- POJ 2810:完美立方
原题链接 总时间限制: 1000ms 内存限制: 65536kB 描述 形如\(a^{2}\)= \(b^{2}\) + \(c^{2}\) + \(d^{2}\)的等式被称为完美立方等式.例如123 ...
- Linux内核配置编译及基本调试方法
一.Linux内核配置编译 1. 交叉编译设置:make ARCH=arm CROSS_COMPILE=arm-linux- 注:也可以直接修改顶层Makefile ARCH ?= arm CROSS ...
- Windows学习Nodejs、Npm和VUE
前言 本文主要以开发的角度讲解Node.js,Npm和Vue. Node.js学习 什么是Node.js Node.js简单来说就是一个IISExpress,提供一个前端Html的独立运行环境. 安装 ...
- 00-04.kaliLinux-手动配置IP地址
在KaliLinux中手动配置网卡 用vim打开网卡的配置文件,配置各个网卡信息 root@kali:~# cd /etc/network root@kali:/etc/network# ------ ...
- Python模拟用户登录场景
简单模拟登录场景,将已知的用户名及密码固化,通过用户输入内容和已固化的内容比较进行判断用户名和密码是否输入正确. 在用户输入时,将密码隐藏需要导入模块getpass import getpass _u ...
- 【微信H5】 Redirect_uri参数错误解决方法
1 https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx14127af0bc9fd367&redirect_uri=http ...
- Source Insight 中的 Auto Indenting
编码过程中,希望输入花括号时能自动对齐,Source Insigth 应如何设置? 先来看一下Source Insight 中的帮助. “ Auto Indenting The auto-indent ...
- java特性 JDK JRE JVM
1简单性 2可移植性性(跨平台) 3面向对象 4高性能 5分布式 6动态性 7多线程 8安全性JDK:java开发工具 . JRE:JDK:java运行环境 . JVM:JDK:java虚拟机
- matlab实现梯度下降法(Gradient Descent)的一个例子
在此记录使用matlab作梯度下降法(GD)求函数极值的一个例子: 问题设定: 1. 我们有一个$n$个数据点,每个数据点是一个$d$维的向量,向量组成一个data矩阵$\mathbf{X}\in \ ...