javascript - 彩盒中的多个视频

Question

我正在尝试将多个youtube视频放置在一个颜色框弹出窗口中，以便在打开它时可以选择在它们之间滚动，就像使用一组图片一样。

我有3个视频，我用一个按钮打开颜色框，这就是我遇到的问题。

我敢肯定它很简单，我只是不知道它需要的格式。

希望有人能帮忙。

丹佛

<a class="group2 youtube" href="http://www.youtube.com/watch?v=4rGhUnJ7SVc" ></a>
<a class="group2 youtube" href="http://www.youtube.com/watch?v=4rGhUnJ7SVc" ></a>
<a class="group2 youtube" href="http://www.youtube.com/watch?v=4rGhUnJ7SVc" ></a>

  $(document).ready(function(){
      $(".youtube").colorbox({iframe:true, innerWidth:1000, innerHeight:600});
      $(".group2").colorbox({rel:'group2', transition:"fade", width:"90%", height:"90%"});
  });

Answer 1

我认为您必须将视频嵌入网址插入href属性而不是视频网址，并且可以在链接sg的rel属性中设置组，如下所示:

<a class="youtube" href="//www.youtube.com/embed/4rGhUnJ7SVc" rel="group1">video 1</a>
<a class="youtube" href="//www.youtube.com/embed/4rGhUnJ7SVc" rel="group1">video 1</a>
<a class="youtube" href="//www.youtube.com/embed/4rGhUnJ7SVc" rel="group1">video 1</a>

之后，您可以通过以下方式通过链接创建一个颜色框:

$(document).ready(function(){
    $(".youtube").colorbox({iframe:true, innerWidth:1000, innerHeight:600});
}