最后的效果

1、从官网下载JWPlayer

下载后的文件，标红部分是必要的文件。

2、Jquery可以使用1.6以上版本

<html><head>

    <title>Greenpeace: Aurora</title>

    <style>

        body, html,.full-size{overflow: hidden;padding: 0;margin: 0;width: 100%;height: 100%;background: transparent;}

    </style>

	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

	<script src="jwplayer.js"></script>

</head>

<body>

<div id="videoPlayer_wrapper" style="position: relative; width: 100%; height: 100%;">

<object type="application/x-shockwave-flash" data="http://static.dazedcdn.com/swf/player-v5-8.swf" width="100%" height="100%" bgcolor="#000000" id="videoPlayer" name="videoPlayer" tabindex="0">

<param name="allowfullscreen" value="true">

<param name="allowscriptaccess" value="always">

<param name="seamlesstabbing" value="true">

<param name="wmode" value="opaque">

<param name="flashvars" value="netstreambasepath=http%3A%2F%2Fwww.dazeddigital.com%2Fembed%2F1362&id=videoPlayer&image=http%3A%2F%2Fimages.dazedcdn.com%2F786%2Fdd%2F1040%2F7%2F1047877.jpg&file=http%3A%2F%2Fpseudo01.hddn.com%2Fvod%2Fdazeddigital.dazedgroup1%2Fvideos%2F1362-greenpeace-aurora.mp4&skin=http%3A%2F%2Fstatic.dazedcdn.com%2Fswf%2Fhtml5-dazed-skin%2Fdazeddigital.zip&stretching=uniform&provider=http&bufferlength=5&autostart=false&plugins=http%3A%2F%2Flp.longtailvideo.com%2F5%2Fsharing%2Fsharing.swf&sharing.code=%253Ciframe%2520src%3D%2522http%3A%2F%2Fwww.dazeddigital.com%2Fembed%2F1362%2522%2520width%3D%2522420%2522%2520height%3D%2522237%2522%2520frameborder%3D%25220%2522%2520webkitAllowFullScreen%2520allowFullScreen%253E%253C%2Fiframe%253E&sharing.link=http%3A%2F%2Fwww.dazeddigital.com%2Fvideo%2Fgreenpeace-aurora%2F1362&sharing.pluginmode=HYBRID&controlbar.position=over&logo.hide=true">

</object>

</div>

<script type="text/javascript">

	jwplayer("videoPlayer").setup({

		"width": "100%",

		"height": "100%",

		"image": "http://images.dazedcdn.com/786/dd/1040/7/1047877.jpg",

		"file": "http://pseudo01.hddn.com/vod/dazeddigital.dazedgroup1/videos/1362-greenpeace-aurora.mp4",

		"skin": "http://static.dazedcdn.com/swf/html5-dazed-skin/dazeddigital.zip",

			"stretching": "uniform",

			"provider": "http",

			"id": "videoPlayer",

			"bufferlength": "5",

			"autostart": false,

			"logo.hide": true,

			/* Please can you add in the info for embed of remove the plugin */

			"plugins": {

				"sharing-3": {

					 Video ID Has to added after "/embed/"

					"code": "%3Ciframe%20src=%22" + "http://www.dazeddigital.com/embed/1362" + "%22%20width=%22420%22%20height=%22237%22%20frameborder=%220%22%20webkitAllowFullScreen%20allowFullScreen%3E%3C/iframe%3E",

					// Page URL has to go here. (For Sharing)

					"link": "http://www.dazeddigital.com/video/greenpeace-aurora/1362"

				},

				/*Also will need data added - UA-753100-14 instead of _videogaq js?*/

				"gapro-2": {

					"trackingobject": "_gaq",

					"idstring": "Greenpeace: Aurora",

				    "trackstarts": true,

				   "trackpercentage": true,

				   "tracktime": true

				}

			},

			"modes": [

                        { "type": "flash", "src": "http://static.dazedcdn.com/swf/player-v5-8.swf" },

                        { "type": "html5" }

			]

		});

</script>

</body></html>

说明：

file为要播放的视频路径，

image为设置未播放的封面图片

skin为设置具体的皮肤

plugins可以做些插件，比如分享、播放视屏前，播放几秒广告等。

3、动态load文件

file为要播放的视频路径，image为设置未播放的封面图片。

jwplayer().load([{file:fielUrl,image:imageUrl}]);

4、其他的一些操作可以参考JWplayer提供的API

JWPlayer 使用小记的更多相关文章

  1. [原]Paste.deploy 与 WSGI, keystone 小记

    Paste.deploy 与 WSGI, keystone 小记 名词解释: Paste.deploy 是一个WSGI工具包,用于更方便的管理WSGI应用, 可以通过配置文件,将WSGI应用加载起来. ...

  2. MySql 小记

    MySql  简单 小记 以备查看 1.sql概述 1.什么是sql? 2.sql发展过程? 3.sql标准与方言的关系? 4.常用数据库? 5.MySql数据库安装? 2.关键概念 表结构----- ...

  3. Git小记

    Git简~介 Git是一个分布式版本控制系统,其他的版本控制系统我只用过SVN,但用的时间不长.大家都知道,分布式的好处多多,而且分布式已经包含了集中式的几乎所有功能.Linus创造Git的传奇经历就 ...

  4. 广州PostgreSQL用户会技术交流会小记 2015-9-19

    广州PostgreSQL用户会技术交流会小记 2015-9-19 今天去了广州PostgreSQL用户会组织的技术交流会 分别有两个session 第一个讲师介绍了他公司使用PostgreSQL-X2 ...

  5. 东哥读书小记 之 《MacTalk人生元编程》

         一直以来的自我感觉:自己是个记性偏弱的人.反正从小读书就喜欢做笔记(可自己的字写得巨丑无比,尼玛不科学呀),抄书这事儿真的就常发生俺的身上. 因为那时经常要背诵课文之类,反正为了怕自己忘记, ...

  6. Paypal支付小记

    Paypal支付小记 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !impo ...

  7. jwplayer播放器停止 单页内多个jwplayer对象停止问题

    单页内多个jwplayer对象停止问题,一直没有找到单页内多个jwplayer播放器停止问题,点击其中一个停止其他播放器; 整个播放代码Remove(),这样就可以停止了,也在ie下防止暂停不了.重音 ...

  8. linux 下cmake 编译 ,调用,调试 poco 1.6.0 小记

    上篇文章 小记了: 关于 Poco::TCPServer框架 (windows 下使用的是 select模型) 学习笔记. http://www.cnblogs.com/bleachli/p/4352 ...

  9. mongodb入门学习小记

    Mongodb 简单入门(个人学习小记) 1.安装并注册成服务:(示例) E:\DevTools\mongodb3.2.6\bin>mongod.exe --bind_ip 127.0.0.1 ...

随机推荐

  1. 《javascript dom编程艺术》笔记（二）——美术馆示例

    这几天把这本书看完了,里面大部分知识我已经会了,所以看得就略简单,好多地方都没有再去动手去做,我知道这样是不对的,以后补吧. 现在我要做的是把这本书的笔记完结掉,不然总觉得有啥事没有做. 这个版本不是 ...

  2. ajax调用后台Java

    //html部分 <input type='text' placeholder='用户名' id="username" name="username" c ...

  3. jmeter实例演示

    Jmeter 是比较轻便的性能测试工具,下面根据一个实例演示下jmeter的常见用法 一.前期准备,在使用之前,先分析测试需求,比如:需不要登录?需不需要监视服务器性能?多线程还是多循环?需不需根据流 ...

  4. UEFI引导系统

    UEFI引导系统 1 2 3 4 5 6 7 分步阅读 现在的电脑大多数使用了UEFI引导系统(原来都是使用BIOS),从而加快启动速度,但同时也给用惯BIOS的用户带来很多困惑!为啥电脑不能识别制作 ...

  5. SendMessage的返回值，就是由相应的响应消息函数的返回值（解释的简洁明了）

    SendMessage Return Values The return value specifies the result of the message processing and depend ...

  6. C++赋值运算符、函数调用运算符、下标运算符（“=”、“（）”、“[]”）重载

    #include <iostream>#include <assert.h>#include <string.h> using namespace std; cla ...

  7. 04737_C++程序设计_第10章_面向对象设计实例

    10.6.2 使用包含的参考程序及运行结果. 头文件cpp10.h 源文件cpp10.cpp 源文件Find10.cpp 头文件cpp10.h #if ! defined(CPP10_H) #defi ...

  8. java--jsp+ssh+select动态结合数据和选择(解)

    在三层体系结构和jsp合并项目,如何实现select动态绑定数据和动态选择指定的行?让我们来看看下面的: 1.首先定义一个Bean分类.它用于实例select的结合数据中的每一个id和name: pu ...

  9. 潜在语义分析Latent semantic analysis note(LSA)原理及代码

    文章引用:http://blog.sina.com.cn/s/blog_62a9902f0101cjl3.html Latent Semantic Analysis (LSA)也被称为Latent S ...

  10. Android Gson深入分析

    眼下解析json有三种工具:org.json(Java经常使用的解析),fastjson(阿里巴巴project师开发的).Gson(Google官网出的).解析速度最快的是Gson,下载地址:htt ...