Javascript 通过单击Vimeo中的屏幕禁用视频停止_Javascript_Video_Vimeo

Javascript 通过单击Vimeo中的屏幕禁用视频停止

javascript video

Javascript 通过单击Vimeo中的屏幕禁用视频停止,javascript,video,vimeo,Javascript,Video,Vimeo,我正试图找出以下关于Vimeo Player的“问题”（为了更好的功能，我使用Vimeo Plus） a）我想尝试禁用一个选项，即当用户单击视频时，视频停止。即使我隐藏了几乎所有的东西，视频仍然可以在播放时点击停止。我想尝试禁用此功能。或禁用用户与视频的任何交互（例如，在视频区域禁用或忽略鼠标光标） b）如果无法执行上述操作，我希望至少向用户显示另一条消息，例如“您已停止视频。请再次单击视频以播放”。或者当用户停止视频以再次自动播放视频时感谢您对答案的任何建议或导致答案的信息再进一步解释

我正试图找出以下关于Vimeo Player的“问题”（为了更好的功能，我使用Vimeo Plus）

a）我想尝试禁用一个选项，即当用户单击视频时，视频停止。即使我隐藏了几乎所有的东西，视频仍然可以在播放时点击停止。我想尝试禁用此功能。或禁用用户与视频的任何交互（例如，在视频区域禁用或忽略鼠标光标）

b）如果无法执行上述操作，我希望至少向用户显示另一条消息，例如“您已停止视频。请再次单击视频以播放”。或者当用户停止视频以再次自动播放视频时

感谢您对答案的任何建议或导致答案的信息

再进一步解释一下。该开发正在Qualtrics（）平台内进行

基本代码：

<!DOCTYPE html>
<html>
 <head>
  <title>Experiment</title>
 </head>
 <body>

  <div style="text-align: center;">
   <iframe allowfullscreen="" frameborder="0" height="360" mozallowfullscreen=""src="https://player.vimeo.com/video/ANONYM?autoplay=1&amp;title=0&amp;byline=0&amp;portrait=0" webkitallowfullscreen="" width="640">
   </iframe>
  </div>

 </body>
</html>


实验

我不知道如何禁用它。因此，我只发布带有自动播放功能的当前代码和我知道如何使用的功能。

您必须在iframe下创建另一层（一个空div），它将捕获所有事件

样本：

<html>
  <head>
    <title>Vimeo</title>
  </head>
  <style type="text/css">
    #box {

      position: absolute; 
      width: 640px;
      height: 360px;
      margin-top: -360px;
      border: 2px solid green;
    }
  </style>
  <body>
    <iframe src="https://player.vimeo.com/video/83611065?color=ff9933&autoplay=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen autoplay></iframe>
    <div id="box"></div>
  </body>
</html>


维梅奥
#盒子{
位置：绝对位置；
宽度：640px；
高度：360px；
利润上限：-360px；
边框：2倍纯绿；
}

您必须在iframe下创建另一层（一个空div），它将捕获所有事件

样本：

<html>
  <head>
    <title>Vimeo</title>
  </head>
  <style type="text/css">
    #box {

      position: absolute; 
      width: 640px;
      height: 360px;
      margin-top: -360px;
      border: 2px solid green;
    }
  </style>
  <body>
    <iframe src="https://player.vimeo.com/video/83611065?color=ff9933&autoplay=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen autoplay></iframe>
    <div id="box"></div>
  </body>
</html>


维梅奥
#盒子{
位置：绝对位置；
宽度：640px；
高度：360px；
利润上限：-360px；
边框：2倍纯绿；
}

您的代码是什么样子的？请提供您的编码尝试，我们将提供帮助。您可以在播放机上方放置一个大小相同的空div，这样用户就不能直接单击播放机。正如我从你的回答中所看到的，你并没有计划任何交互。我已经添加了一个代码，我目前正在使用和工作。它没有我要问的功能，因为我不知道该如何做。很抱歉之前没有包含它。您的代码是什么样子的？请提供您的编码尝试，我们将提供帮助。您可以在播放机上方放置一个大小相同的空div，以便用户无法直接单击播放机。正如我从你的回答中所看到的，你并没有计划任何交互。我已经添加了一个代码，我目前正在使用和工作。它没有我要问的功能，因为我不知道该如何做。很抱歉之前没有包括。您好，谢谢您的回答。我确实用过你的密码。但有一件事让我好奇。在{框中，有一个代码“margin top:-360px”。当我在这个值中使用它时，框并不完全围绕视频，实际上在顶部留下了大约3-4 px的空间。我使用“-366px”然后一切正常。你认为为什么会发生这种情况？你好。你应该删除这种样式：

边框：2px纯绿；

。谢谢，这很有帮助。你好，谢谢你的回答。我确实使用了你的代码。但有一件事让我很好奇。在{框}内，有一张代码图片“边距顶部：-360px”。当我在这个值中使用这个值时，框并不完全围绕视频，实际上在顶部留下了大约3-4像素的空间。我使用了“-366px”，然后就没事了。你认为这是为什么？您好。您应该删除此样式：

边框：2px纯绿；

。谢谢，这很有帮助。