0
点赞
收藏
分享

微信扫一扫

JW Player 网页媒体播放利器播放视音频


JW Media Player是一个开源的在网页上使用的Flash视频、音频以及图片播放器,支持 Sliverlight 播放,可以通过一个XML文件使播放器自动切换显示一组图片,并播放背景音乐。
它支持播放的Adobe Flash Player和HTML5浏览器可以处理任何格式(FLV文件,H.264标准,MP4功能,VP8的,WEBM,支持MP3,AAC,JPG,PNG和GIF)。它也支持各种流和播放清单格式(包括RTMP协议,HTTP直播和更多)和多种播放选项。并支持所有主要的CDN和自适应比特率切换意味着你可以在全球各地提供高质量的内容。
JW Player是一个先进的视频平台,您可以进行自定义和扩展:
无需特殊工具,你可以编辑文本创建图像,然后你可以建立一个皮肤。
它的插件架构 和 JavaScript API让您可以轻松地扩展它的功能,融入您的网站,或连接到第三方服务。

创建媒体提供商的能力意味着您可以连接到自己的专有CDN或内容服务器。


【1】需要使用的js文件

【开源的,可以自行下载】--(网上的JwPlayer的很多版本都有问题,所以下载时,多下载几个版本,只要可用为止)

1) jQuery  -- jquery-1.6.2.js

2) JwPlayer

JW Player 网页媒体播放利器播放视音频_rtmp jw


【2】文件播放的HTML定义如下:


<html>

<!--引用必要的js文件-->
<head>
<title>在线播放器</title>
<script src="js/jquery/jquery-1.6.2.js" type="text/javascript"></script>
<script src="js/plugins/jwplayer/jwplayer.js" type="text/javascript"></script>
</head>

<body>

<!--html结构-->
<div id='container'>Loading the player...</div>
<input type="button" class="player-play" value="播放" />
<input type="button" class="player-stop" value="停止" />
<input type="button" class="player-status" value="取得状态" />
<input type="button" class="player-current" value="当前播放秒数" />
<input type="button" class="player-goto" value="转到第30秒播放" />
<input type="button" class="player-length" value="视频时长(秒)" />

<!--初始化播放器-->
<script type="text/javascript">
var thePlayer; // 保存当前播放器以便操作
$(function() {
thePlayer = jwplayer('container').setup({
flashplayer: 'js/plugins/jwplayer/jwplayer.swf',
file: 'js/plugins/jwplayer/video.mp4',
image: 'js/plugins/jwplayer/preview.jpg',
width: 1280,
height: 720,
title: 'Hkfy.Com',
repeat: "always",
aspectratio: "16:9",
dock: false
});

// 播放 暂停
$('.player-play').click(function() {
if (thePlayer.getState() != 'PLAYING') {
thePlayer.play(true);
this.value = '暂停';
} else {
thePlayer.play(false);
this.value = '播放';
}
});

// 停止
$('.player-stop').click(function() { thePlayer.stop(); });

// 获取状态
$('.player-status').click(function() {
var state = thePlayer.getState();
var msg;
switch (state) {
case 'BUFFERING':
msg = '加载中';
break;
case 'PLAYING':
msg = '正在播放';
break;
case 'PAUSED':
msg = '暂停';
break;
case 'IDLE':
msg = '停止';
break;
}
alert(msg);
});

// 获取播放进度
$('.player-current').click(function() { alert(thePlayer.getPosition()); });

// 跳转到指定位置播放
$('.player-goto').click(function() {
if (thePlayer.getState() != 'PLAYING') { // 若当前未播放,先启动播放器
thePlayer.play();
}
thePlayer.seek(10); // 从指定位置开始播放(单位:秒)
});

// 获取视频长度
$('.player-length').click(function() { alert(thePlayer.getDuration()); });

});
</script>

</body>
</html>


【3】网页打开效果如下:

JW Player 网页媒体播放利器播放视音频_rtmp jw_02

举报

相关推荐

0 条评论