前言

Flowplayer 是一个开源(GPL 3的)WEB视频播放器。您可以将该播放器嵌入您的网页中,如果您是开发人员,您还可以自由定制和配置播放器相关参数以达到您要的播放效果。支持播放MP4、flv、swf等流媒体以及图片文件,能够非常流畅的播放视频文件,支持自定义配置和扩展。
测试项目源文件:http://download.csdn.net/detail/u010989191/9513711。

如何使用?

加载flowplayer.js

因为依赖于jQuery开源库,故需要先加载jQuery,然后加载flowplayer.min.js

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<!-- include flowplayer -->
<script src="./js/flowplayer.min.js"></script> 

使用方式

 <div class="flowplayer" data-swf="./swf/flowplayer.swf" data-ratio="0.4167"><video><source type="video/mp4" src="./mp4/kc5Zfm44NeeT8nvv-MbhUQ__.mp4"></video></div>

演示源码

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Flowplayer流视屏</title>
<link rel="stylesheet" href="skin/functional.css">
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<!-- include flowplayer -->
<script src="./js/flowplayer.min.js"></script>
<style>body { font: 12px "Myriad Pro", "Lucida Grande", sans-serif; text-align: center; padding-top: 10px; }.flowplayer { width: 80%; padding-bottom: 10px; }
</style>
</head>
<body><h3>播放本地视频./mp4/kc5Zfm44NeeT8nvv-MbhUQ__.mp</h3><!-- the player --><div class="flowplayer" data-swf="./swf/flowplayer.swf" data-ratio="0.4167"><video><source type="video/mp4" src="./mp4/kc5Zfm44NeeT8nvv-MbhUQ__.mp4"></video></div><h3>播放视频链接:http://dlqncdn.miaopai.com/stream/L~OdavVeSPc-9RyHhLxqZA__.mp4</h3><!-- the player --><div class="flowplayer" data-swf="./swf/flowplayer.swf" data-ratio="0.4167"><video><source type="video/mp4" src="http://dlqncdn.miaopai.com/stream/L~OdavVeSPc-9RyHhLxqZA__.mp4"></video></div></body>
</html>

运行结果


总结

本文只是简单演示了flowplayer流视屏怎么使用的。在前言中可以直接进入官网了解到更详细的使用说明。

Flowplayer基于视频流的免费web视频播放器相关推荐

  1. web player html5源码,基于Flowplayer打造一款免费的WEB视频播放器附源码

    Flowplayer 是一个开源(GPL 3的)WEB视频播放器.您可以将该播放器嵌入您的网页中,如果您是开发人员,您还可以自由定制和配置播放器相关参数以达到您要的播放效果.本文主要介绍Flowpla ...

  2. php网页播放器源码免费,基于Flowplayer打造一款免费的WEB视频播放器附源码

    Flowplayer 是一个开源(GPL 3的)WEB视频播放器.您可以将该播放器嵌入您的网页中,如果您是开发人员,您还可以自由订制跟配置播放器相关参数以达到您要的播放疗效.本文主要介绍Flowpla ...

  3. Flowplayer一款免费的WEB视频播放器

    Flowplayer 是一个开源(GPL 3的)WEB视频播放器.您可以将该播放器嵌入您的网页中,如果您是开发人员,您还可以自由定制和配置播放器相关参数以达到您要的播放效果.本文主要介绍Flowpla ...

  4. 一款免费的WEB视频播放器Flowplayer

    原文地址:http://www.cnblogs.com/yuzhongwusan/archive/2012/02/08/2342349.html Flowplayer 是一个开源(GPL 3的)WEB ...

  5. 最简单的基于DirectShow的示例:视频播放器自定义版

    ===================================================== 最简单的基于DirectShow的示例文章列表: 最简单的基于DirectShow的示例:视 ...

  6. 最简单的基于DirectShow的示例:视频播放器图形界面版

    ===================================================== 最简单的基于DirectShow的示例文章列表: 最简单的基于DirectShow的示例:视 ...

  7. 基于WASM的H265 Web播放器

    基于WASM的H265 Web播放器 1 背景 2 代码 3 依赖 3.1 WASM 3.2 FFmpeg 3.3 WebGL 3.4 Web Audio 4 播放器实现 4.1 模块结构 4.2 线 ...

  8. 最简单的基于DirectShow的示例:视频播放器

    ===================================================== 最简单的基于DirectShow的示例文章列表: 最简单的基于DirectShow的示例:视 ...

  9. 在线html5视频播放器,分享10款最棒的免费HTML5视频播放器

    最近Web圈子里最让人激动地莫过于HTML5了,特别是HTML5视频,使用HTML5视频标签可以帮助我们解决困扰我们很长时间的网站视频插入问题.HTML5可以在没有flash的情况下播放视频.现在有很 ...

最新文章

  1. 崛起于Springboot2.X之Mybatis-全注解方式操作Mysql(4)
  2. ERP实施实记(六)之生管课
  3. php根据id查找条件怎么写_thinkphp where()条件查询
  4. java 俄罗斯方块窗口_[代码全屏查看]-java 俄罗斯方块
  5. Little Elephant and Shifts(CF-220C)
  6. XCODE---个人常用快捷键整理
  7. 当代年轻人加班报告!
  8. Linux rmmod命令
  9. Clean Code 笔记
  10. day69-oracle 22-DBCA
  11. QT递归获取指定目录下的所有文件
  12. DUMP-CX_SY_OPEN_SQL_DB-DBSQL_DUPLICATE_KEY_ERROR
  13. BPSK调制系统MATLAB仿真实现(1)
  14. 转:读“DataBase Sharding at Netlog”,看DataBase Scale Out
  15. 最新服务器处理器天梯,服务器cpu天梯图2020
  16. 软件测试周刊(第32期):沙漠中藏着一口井
  17. Linux服务器配置静态IP地址方法
  18. 国际日期书写标准格式
  19. 听说你还在花钱从网上买 PPT 模板?
  20. 第一本全方位阐述华为端到端战略管理体系的著作《华为战略管理法:DSTE实战体系》出版了!!

热门文章

  1. 设计模式_迭代器模式01
  2. 【专项测试】系统数据迁移
  3. TI DSP BootLoader技术要点概述
  4. Markdown (CSDN) MD编辑器(一)- 实现页内跳转
  5. unity5.6.5适配Android P刘海屏,两侧去黑边
  6. altium 网口差分走线长度_Altium Design 中差分走线的设置
  7. Springboot连接mysql数据库(jdbcTemplate)
  8. FPGA always 和assign 用法
  9. 【专家访谈】性能架构师 - 贾江兵
  10. [转]MySQL整数数据的精确数字数据类型