video-js采用的是html5播放器。

在不支持html5的浏览器会自动切换成flash。

video-js的官网http://www.videojs.com/

看看下载的demo就知道个大概了。

不过在ie9上某些视频流会出问题。

不过加上:

<!--[if lt IE 9]>
<script src="${resSys}/html5.js" type="text/javascript"></script>
<![endif]-->

我是这么写的。

引入样式和js

<link href="${base}/thirdparty/video-js/video-js.css" rel="stylesheet" type="text/css">
  <script src="${base}/thirdparty/video-js/video.js"></script>

播放器:

<video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="500" height="350"
    poster=""
      data-setup="{}">
    <source src="${base}/thirdparty/video-js/04140025hf10.flv" type='video/flv' />
    <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
  </video>

${base}是我的项目路径,请大家自行更改。

亲测chorme,360,ie7,ie8,ie9,可用支持flv,mp4。

一个非常给力的播放器video-js的更多相关文章

  1. JavaScript多个h5播放器video,点击一个播放其他暂停

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. HTML5播放器 MediaElement.js 使用方法

    目前已经有很多html5播放器可以使用,使用html5播放器可以轻松的在页面中插入媒体视频,从而使我们的web页面变得更加丰富多彩,所以今 天向大家推荐一款非常优秀的html5播放器MediaElem ...

  3. Hide-Music-Player 一个完整的音乐播放器《IT蓝豹》

    Hide-Music-Player 一个完整的音乐播放器 Hide-Music-Player 一个完整的音乐播放器,本例子主要包括几个点 (1)摇一摇进入播放器 (2)下拉展开新视图(扫描音乐) (3 ...

  4. Swift - 制作一个在线流媒体音乐播放器(使用StreamingKit库)

    在之前的文章中,我介绍了如何使用 AVPlayer 制作一个简单的音乐播放器(点击查看1.点击查看2).虽然这个播放器也可以播放网络音频,但其实际上是将音频文件下载到本地后再播放的. 本文演示如何使用 ...

  5. 用H5和js写一个移动端自定义播放器

    前言 由于html5自带的播放器样式不怎么好看,大多数人都是自己写一个来满足业务需求.这一次的需求如下: 1.不要上一曲下一曲 2.有进度条和播放暂停按钮 3.有时间显示 demo实现功能 1.进度条 ...

  6. JS写一个漂亮的音乐播放器

    先放上效果图: 正如图中所展示的播放器那样,我们用HTML+CSS+JS将这个效果实现出来. HTML页面布局 <div class="music"> <div ...

  7. jqm视频播放器,html5视频播放器,html5音乐播放器,html5媒体播放器,video开展demo,html5视频播放演示示例,html5移动视频播放器

    最近看到很多有用的论坛html5视频播放的发展,音乐播放功能,大多数都在寻找答案.所以,我在这里做一个demo.对于大家互相学习.html5开发越来越流行,至于这也是一个不可缺少的一部分的视频. 如何 ...

  8. 习课的视频播放器 video.js

    jsp <%@ page language="java" contentType="text/html; charset=utf-8" pageEncod ...

  9. [HTML5和Flash视频播放器]Video.js 学习笔记(一 ) HLS库:videojs-contrib-hls

    DEMO地址:https://github.com/Tinywan/PHP_Experience https://github.com/videojs/videojs-contrib-hls 下载JS ...

随机推荐

  1. qt超强精美绘图控件 - QCustomPlot一览 及 安装使用教程

    1.概述 QCustomPlot 是一个超强超小巧的qt绘图类,非常漂亮,非常易用,只需要加入一个qcustomplot.h和qcustomplot.cpp文件即可使用,远比qwt方便和漂亮,可以自己 ...

  2. oracle 10g 数据库字符集更改

    1.更改数据库字符集为GBK SHUTDOWN IMMEDIATE; STARTUP MOUNT EXCLUSIVE; ALTER SYSTEM ENABLE RESTRICTED SESSION;A ...

  3. ASP.NET导入Excel到SQL数据库

    protected void btnChange_Click(object sender, EventArgs e) { UserInfoClass tClass = (UserInfoClass)S ...

  4. [原创]VS2010中创建动态链接库及其调用

    [原创]VS2010中创建动态链接库及其调用 一.创建动态链接库 在VS2010中创建动态链接库的步骤如下: 1)生成->编译->生成MyDll 二.调用 当调用DLL中的方法,程序编译产 ...

  5. C# 给自己的代码 添加上 自己的版权信息

    如何将自己的代码自动添加版权信息 现在大多数公司都规定程序员在程序文件的头部加上版权信息,这样每个人写的文件都可以区分开来,如果某个文件出现问题就可以快速的找到文件的创建人,用最短的时间来解决问题,常 ...

  6. Android 播放gif图片

    Android的原生控件并不支持播放GIF格式的图片.我们都知道,在Android中如果想要显示一张图片,可以借助ImageView控件来完成,但是如果将一张GIF图片设置到ImageView里,它只 ...

  7. shell之rm -rf的别名设置

    vim ~/.bashrc alias rm='read -p "Are you ready?" y && [ $y == "y" ] & ...

  8. mongodb batchInsert

    看到<MongoDB 权威指南>第二版P30提到了一个batchInset的插入方法,对于一次性插入大量数据时可以提高性能.按照书上的列子,却提示错误: 本书是基于MongoDB V2.4 ...

  9. js加载优化-二

    http://www.cnblogs.com/radom/archive/2011/04/26/2028886.html ontrolJS 主要为了是解决网页加载中Js文件的性能问题,ControlJ ...

  10. hdu 1466 计算直线的交点数

    http://acm.hdu.edu.cn/showproblem.php?pid=1466 N条直线的交点方案数 = c 条直线交叉的交点数与(N-c)条平行线 + c 条直线本身的交点方案 = ( ...