Flowplayer基于视频流的免费web视频播放器
2017-10-06 00:00
302 查看
前言
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视频播放器
- 基于嵌入式WEB的视频服务器的设计与实现
- ijkplayer简单实现播放 ijkplayer是Bilibili基于ffmpeg开发并开源的轻量级视频播放器,支持播放本地网络视频,也支持流媒体播放。支持
- 网页视频播放器代码大全 + 21个为您的站点和博客提供的免费视频播放器
- 基于Z301P摄像头 H.264OK6410的远程视频web监控 项目笔记2
- 基于Z301P摄像头 H.264OK6410的远程视频web监控 项目笔记5(小车驱动)GPIO控制
- 基于mjpg-streamer远程视频WEB监控 项目笔记一
- 基于嵌入式WEB的视频服务器的设计
- 基于Z301P摄像头 H.264OK6410的远程视频web监控 项目笔记3(与外网通信)
- WebService-CXF-Spring 基于web的cxf(三)------参考传智播客视频
- Django视频教程 - 基于Python的Web框架(全13集)
- 5个免费Web视频及音频播放器
- 网页视频播放器代码大全 + 21个为您的网站和博客提供的免费视频播放器
- 基于mjpg-streamer远程视频WEB监控 项目笔记二
- 3大框架(Hibernate+Spring+Struts2)+Java入门,JavaWeb,Android,C#,.Net,wp热门最新经典视频免费下载!
- 基于嵌入式WEB的视频服务器的设计
- ZLMS教学管理平台系统V1.2.0最新版本发布,支持纯Web视频直播点播,还带运营在线支付功能!完全免费提供!
- 网页视频播放器代码大全 + 21个为您的网站和博客提供的免费视频播放器
- 基于Z301P摄像头 H.264OK6410的远程视频web监控 项目笔记1
- 基于Z301P摄像头 H.264OK6410的远程视频web监控 项目笔记4(驱动预习)