他,
我需要develeop一个网站,将嵌入视频,还有Vimeo。 如果我使用VimeoAPI,可以在视频播放结束后Ilisten? 如果它完成了,我可以开始从Vimeo的另一个视频?
谢谢,戴夫。
他,
我需要develeop一个网站,将嵌入视频,还有Vimeo。 如果我使用VimeoAPI,可以在视频播放结束后Ilisten? 如果它完成了,我可以开始从Vimeo的另一个视频?
谢谢,戴夫。
假设你已经使用所提供的代码Vimeo的阿比页面,你应该使用下面显示的初始视频:
<!doctype html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="custom.js" ></script>
</head>
<body>
<iframe id="vimeoplayer"
src="//player.vimeo.com/video/76979871?api=1&player_id=vimeoplayer"
width="100%" height="100%" webkitallowfullscreen mozallowfullscreen
allowfullscreen ></iframe>
<div>
<button>Play</button>
<button>Stop</button>
<p>Status: <span class="status">…</span></p>
</div>
</body>
</html>
确保IFRAME ID与“player_id”一样。
然后在你的custom.js文件中使用来自Vimeo的API页面的代码:
$(function() {
var player = $('#vimeoplayer');
var url = window.location.protocol + player.attr('src').split('?')[0];
var status = $('.status');
// Listen for messages from the player
if (window.addEventListener){
window.addEventListener('message', onMessageReceived, false);
}
else {
window.attachEvent('onmessage', onMessageReceived, false);
}
// Handle messages received from the player
function onMessageReceived(e) {
var data = JSON.parse(e.data);
switch (data.event) {
case 'ready':
onReady();
break;
case 'playProgress':
onPlayProgress(data.data);
break;
case 'pause':
onPause();
break;
case 'finish':
onFinish();
break;
}
}
// Call the API when a button is pressed
$('button').on('click', function() {
post($(this).text().toLowerCase());
});
// Helper function for sending a message to the player
function post(action, value) {
var data = {
method: action
};
if (value) {
data.value = value;
}
var message = JSON.stringify(data);
player[0].contentWindow.postMessage(data, url);
}
function onReady() {
status.text('ready');
post('addEventListener', 'pause');
post('addEventListener', 'finish');
post('addEventListener', 'playProgress');
}
function onPause() {
status.text('paused');
}
// when the video is finished
function onFinish() {
status.text('finished');
// load the next video
document.getElementById('vimeoplayer').src = "//player.vimeo.com/video/104990881?api=1&player_id=vimeovideo";
}
function onPlayProgress(data) {
status.text(data.seconds + 's played');
}
});
改变所述视频,一旦第一个完成时,代码是onFinish()函数的内部。 这个函数中的代码改变的iframe源(SRC)到您想要播放的下一个视频之一。
你可以使用显示另一个视频的替代方法和上面的方法是一个非常基本的一个只是为了显示所请求的功能。
我写了一个jQuery的插件的Vimeo几个月前。 使用这个插件,代码会是这样的:
$("#somevideo").on("finish", function(){
$("#anothervideo").vimeo("play");
});
是的,检查出的信息如何被通知播放器API当影片完成,以及如何开始新的视频https://developer.vimeo.com/player/js-api