vimeo 视频结束时关闭 div答案

【问题标题】：Close div when vimeo video endsvimeo 视频结束时关闭 div
【发布时间】：2021-08-14 22:40:59
【问题描述】：

我需要一个网站来制作介绍视频（网站/背景内容上的全宽 div）。所以我制作了一个带有 iframe 视频 (VIMEO) 的 Div 和一个跳过介绍的按钮（它通过 js 点击关闭 div）。

但我仍然需要它在视频结束后自动关闭 div。有没有办法在 vimeo 视频结束时触发此事件？

我在 youtube 中找到了一种方法（使用 api），但不幸的是我需要它在 vimeo 中，因为它可以隐藏控件、徽标和所有内容。

非常感谢您的关注。

**-- 更新（它有效！）-- 感谢您的帮助！如果有人需要类似的解决方案，这里是代码：**

<div id="videointro">

<iframe src="https://player.vimeo.com/video/xxxxxxxxx?title=0&byline=0&portrait=0&transparent=0&autoplay=1&sidedock=0&controls=0" frameborder="0" title="Funny Cat Videos For Kids" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" data-ready="true"></iframe>

</div>

<button id="btn"></button>


<script src="https://player.vimeo.com/api/player.js"></script>
<script type="text/javascript" src="video.js"></script> 


-- JS --

btn.onclick = function () {
    document.getElementById("videointro").style.display='none';
};

// vimeo 

var iframe = document.querySelector('iframe');
var player = new Vimeo.Player(iframe);

player.on('play', function() {
  console.log('Played the video');
});

player.getVideoTitle().then(function(title) {
  console.log('title:', title);
});

player.on('ended', function() {
    console.log('the end');
    player.destroy();
});

【问题讨论】：

阅读提供的文档，它们会进一步帮助您：developer.vimeo.com/player/sdk/…。谷歌这是一个神奇的东西。
好的，发布你的代码和你尝试过的东西，当你遇到困难时，人们会进一步帮助你。
为 Skip Intro 发布您的代码，您可能可以在 player.getEnded().then(function(ended) { // 'ended' indicates whether the video has ended }); 中重复使用相同的功能
@Jay 它可能不起作用，因为您正在这样做：btn.onclick = function ().... 但您没有在任何地方定义 btn 变量是什么。
因为id是intro而不是videointro

标签： javascript jquery css vimeo vimeo-api

【解决方案1】：

如果有人需要类似的解决方案，代码如下：


<div id="videointro">

<iframe src="https://player.vimeo.com/video/xxxxxxxxx?title=0&byline=0&portrait=0&transparent=0&autoplay=1&sidedock=0&controls=0" frameborder="0" title="Funny Cat Videos For Kids" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen="" data-ready="true"></iframe>

</div>

<button id="btn"></button>


<script src="https://player.vimeo.com/api/player.js"></script>
<script type="text/javascript" src="video.js"></script> 


-- JS --

btn.onclick = function () {
    document.getElementById("videointro").style.display='none';
};

// vimeo 

var iframe = document.querySelector('iframe');
var player = new Vimeo.Player(iframe);

player.on('play', function() {
  console.log('Played the video');
});

player.getVideoTitle().then(function(title) {
  console.log('title:', title);
});

player.on('ended', function() {
    console.log('the end');
    player.destroy();
});

【讨论】：