Flowplayer播放器flash全屏播放器带播放按钮

news/2025/2/1 21:41:30/

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

查看演示DEMO

Flowplayer支持播放flv、swf等流媒体以及图片文件,能够非常流畅的播放视频文件,支持自定义配置和扩展。

1、加载flowplayer.js

在要播放视频的页面的head之间加入flowplayer.js。

 
<script type="text/javascript" src="js/flowplayer-3.2.6.min.js"></script> 

您可以到flowplyer官网上下载最新版本:http://flowplayer.org/download/index.html

2、XHTML

在需要加入播放器的地方加入如下一段代码:

 
<a href="flowplayer.flv" style="display:block;width:520px;height:330px" id="player"></a>  

将a标签的href属性指向要播放的视频地址,然后设置样式,宽度和高度,以及设置display:block,当然关键的是还要给a标签指定一个id,以便于JS调用。

当然你也可以只在html中指定一个DIV,然后由Javascript来控制播放地址,如:

 
<div id="player2" style="width:520px; height:330px"> </div>  

3、Javascript

在页面底部计入javascript脚本调用播放器:

 
<script type="text/javascript"
flowplayer("player""flowplayer-3.2.7.swf"); 
</script> 

使用flowplayer()函数调用播放器,第一个参数是播放器的id,第二个参数是播放器的路径,它是一个flash文件,一定要保证播放器的路径正确。

如果不是使用a标签调用视频文件,而是使用DIV来调用,则代码如下:

 
flowplayer( 
    "player2",  
    "flowplayer-3.2.7.swf",{ 
      clip: { 
        url: "flowplayer.flv"
        autoPlay: false,  
        autoBuffering: true  
      } 
    } 
); 

flowplayer()函数的第三个参数是可以进行多项设置的,其实就是高级设置。clip方法里的url:表示视频文件的真实地址,autoPlay:表示是否自动播放,默认是true,autoBuffering:表示是否自动缓冲,即当视频文件设置为不自动播放时,播放器仍然预先下载视频文件内容。

flowplayer还支持播放列表,以及皮肤设置等多项高级设置,具体设置方法,感兴趣的同学可以请访问:http://flowplayer.org/documentation/configuration/index.html。


http://www.ppmy.cn/news/883497.html

相关文章

如何在HTML中播放flash

随着html的风靡&#xff0c;改变了之前前端的许多条条框框&#xff0c;而video的出现使flash仿佛都要退出历史的舞台了&#xff0c;但是h5也会出现以下局限性&#xff0c;比如说&#xff0c;在一些不支持h5的浏览器上&#xff0c;此处省略一万只草泥马.......... 之前做的一直…

在线视频应用:flash播放器换html5播放器常见的问题汇总

谷歌Chrome 53产品的更新时屏蔽了部分Flash特定应用&#xff0c;Chrome 55浏览器将自动默认使用HTML 5视频&#xff0c;Chrome 58时直接以默认的方式禁止运行flash&#xff0c;至此&#xff0c;曾经无处不在的flash插件&#xff0c;终于将要退出历史舞台了。 图1 - 谷歌浏览器已…

js控制flash播放器

flash播放器 在网页中插入FLASH动画,并给他一个id变量,假设为"flashvar",这时你可以需要的地方用js来控制FLASH对象了... document.FLASH对象名称.方法名称() document.FLASH对象名称.属性 上面的语法适用于IE和Netscape浏览器,但是N6.0和N6.01版不支持...设定对象名…

为FLASH(.SWF)文件添加播放控制条

网上有很多不错的FLASH格式的视频教程,可惜有些视频没有在其中加入能够控制进度的控制条,暴风影音这类软件能够播放FLASH格式的文件,并可以用它自己的控制条进行对FLASH的进度控制,由于各个视频录制时的分辨率不同的问题,使用暴风影音有时会出现画面效果很差,出现很多马赛…

final swfplayer安卓10/11/12上都能播放flash播放器源码

我们先看效果: 安卓Android 11最新的flash播放器源码方案Demo视频 现在网上能搜索到在安卓上播放flash的方案大多都是8年前的方案。那个适合方案有两种。今天就讲第一种把。 第一种就算flash插件&#xff0c;加载webview模式。就算需要安装官方的flash插件&#xff0c;然后再we…

Android简易Flash播放器

上一节&#xff0c;大体说了下在Android程序中嵌套Flash动画。这次按照上次的内容做个扩展&#xff0c;做个简易的flash播放器。 前提条件如上一节所说&#xff0c;需要Android2.2平台和安装flash的插件。 先看工程图和效果图&#xff1a; 工程源码&#xff1a; package com.g…

flash中如何制作播放和暂停按钮(as3.0)

本篇我们就来简单讲讲制作flash中常用的功能&#xff1a;播放与暂停按钮的实现&#xff0c;首先制作或找到两个大小一样的播放与暂停按钮的图片&#xff0c;转换为按钮元件&#xff0c;放入库中&#xff0c;如下图所示&#xff1a; 新建一个图层&#xff0c;然后从库中把元件拖…

JS控制网页中Flash影片的播放(附带各参数)

实现功能&#xff1a; 在网页中嵌入一段swf视频&#xff0c;加载网页时不播放&#xff0c;点击下面的播放按钮实现播放 首先在网页中嵌入Object代码&#xff1a; <object classid"clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width"400" height&qu…