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

时间:2016-05-02 14:15:05

标签: javascript video vimeo

我想弄清楚我在Vimeo Player中遇到的“问题”(我使用的是Vimeo Plus以获得更好的功能)。

a)我想尝试禁用当用户点击视频时视频停止的选项。即使我几乎隐藏了所有内容,视频仍然可以通过在播放时单击来停止。我想尝试禁用它。或者禁用用户与视频的任何交互(例如,在视频区域禁用或忽略鼠标光标)。

b)如果无法实现上述目标,我想至少向用户显示另一条消息,例如“您已停止播放视频。请再次点击该视频进行播放。”或当用户停止再次自动播放视频时。

感谢您提供答案的任何建议或获得答案的信息。

进一步解释。该开发正在一个名为Qualtrics(https://en.wikipedia.org/wiki/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>

我无法弄清楚如何禁用它。因此,我只发布当前使用自动播放的代码以及我知道如何使用的功能。

1 个答案:

答案 0 :(得分:0)

您必须在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>

Demo