JWplayer入门及使用
网上关于JWplayer的知识和文档很多,本文只介绍如何使用JWplayer。
这里使用JWPlayer,需要搭建网络环境(本文使用appserv2.6.0集成环境)
appserv 2.6.0的安装很简单,apache2.2的启动端口80可能会有冲突,解决方法同样google,安装好最好重启下。
JWPlayer官网http://www.longtailvideo.com/
JWPlayer下载页面http://www.longtailvideo.com/jw-player/download/
解压后,将jwplayer整个文件夹放到appserv/www目录下
1. 新建html文件
<html>
<head>
<script src="/jwplayer/jwplayer.js"></script>
</head>
<body>
<div id='myplayer'></div> <script type='text/javascript'> jwplayer('myplayer').setup({ file: 'testfile/H264_640x480_AAC(LC).mp4', width: '640', height: '480' });
</script>
</body>
</html>
file参数根据自己实际情况进行修改
在浏览器中打开就可以观看了(直接打开无效,要不搭appserv网站环境干嘛)
如:http://127.0.0.1/jwplayer/test.html
2.利用jquery 加一些控制
jquery是一个javascript框架,是一个轻量级的js库,可以下载到本地。具体应用请google
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="/jwplayer/jwplayer.js"></script>
</head>
<body>
<div id='myplayer'></div>
<input type="button" class="player-play" value="Play" />
<input type="button" class="player-stop" value="Stop" />
<input type="button" class="player-status" value="Status" />
<input type="button" class="player-position" value="TimeStamp" />
<input type="button" class="player-seek" value="Seek_15s" />
<input type="button" class="player-duration" value="Duration" />
<script type='text/javascript'>var thePlayer;thePlayer = jwplayer('myplayer').setup({ file: 'testfile/H264_640x480_AAC(LC).mp4', width: '640', height: '480',dock: false,repeat: true}); //Play Pause$('.player-play').click(function(){if(thePlayer.getState() != 'PLAYING'){thePlayer.play(true);this.value = 'Pause';}else {thePlayer.play(false);this.value = 'Play';}});//Stop$('.player-stop').click(function(){thePlayer.stop();});//Status$('.player-status').click(function(){var state = thePlayer.getState();var msg;switch(state){case 'BUFFRING':msg = 'Buffering';break;case 'PLAYING':msg = 'Playing';break;case 'PAUSED':msg = 'Pause';break;case 'IDLE':msg = 'Stop';break;}alert(msg);});//get current position$('.player-position').click(function() { alert(thePlayer.getPosition()); });//Seek$('.player-seek').click(function(){if(thePlayer.getState()!= 'PLAYING'){thePlayer.play();}thePlayer.seek(15);});//get duration$('.player-duration').click(function() {alert(thePlayer.getDuration());}); </script>
</body>
</html>
JWplayer入门及使用相关推荐
- JWplayer 用法及参数介绍(一)
JWPlayer的使用入门 这里使用JWPlayer,需要搭建网络环境(phpStudy) JWPlayer官网http://www.longtailvideo.com/ JWPlayer下载页面ht ...
- FFmpeg入门详解之87:HLS直播协议详解
引言与效果演示 ----------------------------------------- FFmpeg431的官方地址已经无法打开, 我将ffmepg4.3.1的开发包和源码上传到了百度云: ...
- FFmpeg入门详解之102:HLS直播协议详解
引言与效果演示 ----------------------------------------- FFmpeg431的官方地址已经无法打开, 我将ffmepg4.3.1的开发包和源码上传到了百度云: ...
- H5直播入门(理论篇)
前言 这篇总结其实是去年公司每周技术分享会轮到我的时候写的.那时候公司正在大刀阔斧地准备直播业务,私以为主管会委以重任,就翻了不少论坛,做了一次简单的技术分享.后来直播业务让另一位同事承担了,自己也就 ...
- 移动端互动直播(入门篇)
本文来自网易云社区 前言 本文为手机视频直播开发新手,为了快速入门,利用强大google搜索引擎结合自身理解而整理的"视频直播入门背景知识". 背景知识 名词解释 推流协议 RTM ...
- 用Construct 2制作入门小游戏~
今天在软导课上了解到了Construct 2这个神器,本零基础菜鸟决定尝试做一个简单的小游戏(实际上是入门的教程啊= = 首先呢,肯定是到官网下载软件啊,点击我下载~ 等安装完毕后我便按照新手教程开始 ...
- Docker入门六部曲——Swarm
原文链接:http://www.dubby.cn/detail.html?id=8738 准备工作 安装Docker(版本最低1.13). 安装好Docker Compose,上一篇文章介绍过的. 安 ...
- Docker入门六部曲——Stack
原文链接:http://www.dubby.cn/detail.html?id=8739 准备知识 安装Docker(版本最低1.13). 阅读完Docker入门六部曲--Swarm,并且完成其中介绍 ...
- Docker入门六部曲——服务
原文链接:http://www.dubby.cn/detail.html?id=8735 准备 已经安装好Docker 1.13或者以上的版本. 安装好Docker Compose.如果你是用的是Do ...
- 【springboot】入门
简介: springBoot是spring团队为了整合spring全家桶中的系列框架做研究出来的一个轻量级框架.随着spring4.0推出而推出,springBoot可以説是J2SEE的一站式解决方案 ...
最新文章
- 大厂也在用的 6种 数据脱敏方案,别做泄密内鬼
- 开源图像编辑器 GIMP 开发者透露 2019 年计划
- 图像处理中的傅里叶变换和频率域滤波概念
- An error was encountered while running(Domain=LaunchSerivcesError, Code=0)
- 【2020模拟考试T5】【PAT乙】1035 插入与归并 (25分) 两种排序的sort写法
- SpringBoot学习笔记(3)----SpringBoot的profile多环境配置
- centos 常用的网络登录端口测试工具
- 使用videojs播放rtmp视频
- 正则表达式[\w]+,\w+,[\w+] 三者区别? [],[ABC]+,[\w./-]+ 表达什么?
- 若菜光个人小档案(dambolo)
- 使用清华镜像快速下载TensorFlow各版本及已安装版本查看
- ImportError:attempted relative import with no known parent package
- 动手学深度学习番外篇 01.为什么from d2l import torch as d2l
- MySQL单机并发量_mysql百万并发量-MySQL集群能支持100万个并发请求吗
- 小米 android项目代码,[Android] 代码获取手机系统类型(小米MIUI、华为EMUI、魅族FLYME)...
- 银河麒麟踩坑笔记——sh文件设置开机自启
- 使用电信云时做对象储存时的异常信息:com.amazonaws.services.s3.model.AmazonS3Exception
- 《Non-contact Eye Gaze Tracking System by Mapping of Corneal Reflections》论文阅读
- jQuery-WEUI(jqweui)的Uploader图片上传方法2.0
- 数据库原理与应用课程知识点
热门文章
- 讯飞tts语音引擎_讯飞输入法A.I.语音引擎再升级 更强大更实用!
- 初学者福利:分享五个免费的 Python 学习网站,抓紧收藏吧
- java在文本框动态显示时间,在文本框中动态地显示当前时间,有木有人做过,指导下初学者...
- Thinkpad T430 重装系统不能从光盘或者U盘启动/BIOS设置 关于T430 无法光盘引导安装-BIOS设置问题...
- linux不显示无线网卡驱动安装失败,无线网卡在Linux下安装
- am3352 软时钟老是漂移 rx-8025时钟 rx-8025SA时钟
- 加密狗复制,破解,备份,模拟,OEM ,写狗工具开发
- crypto密码学知识大纲
- 十:javaee会议管理系统实现过程之会议室管理功能的代码(完整详细有注释)
- 高数_第6章无穷级数__幂级数_收敛点收敛域收敛半径