切换图库中的视频元素 [英] Switch video elements in gallery

问题描述

在一个网站上，我有一个很大的主div，其中包含一个嵌入式youtube视频.

在此主视频下方，我还有另外三个小缩略图视频.

因此，总共有4个视频，其中一个可以播放了.


我希望能够单击任何一个小缩略图视频，并使该视频与主视频切换，然后在主视频区域中自动播放该视频.

我想知道我可以在下面的html中包含哪些Javascript，或者使用无序列表和列表项是否有更好的方法?

On a website I have a large main div which contains an embedded youtube video.

Below this main video I have three other small thumbnail sized videos.

So, a total of 4 videos, one of which is ready to play.


I want to be able to click on any one of the small thumbnail videos and have that video switch with the main video and then autoplay that video in the main video area.

I''m wondering what Javascript I can include to accompany the html below or whether there might be a better method using an unordered list and list items?

<div class="responsive-wrapper">
 <div class="responsive-container">
   <iframe src=""></iframe>
 </div>
</div>

<div class="video-list-wrapper" id="video-gallery"> 
 <div class="responsive-wrapper2">
  <div class="responsive-container">
   <iframe src=""></iframe>
  </div>
 </div>
 <div class="responsive-wrapper2">
  <div class="responsive-container">
   <iframe src=""></iframe>
  </div>
 </div>
 <div class="responsive-wrapper2">
  <div class="responsive-container">
   <iframe src=""></iframe>
  </div>
 </div>
</div> 

推荐答案

使用Jquery，您将获得想要的东西.
这可能对您有帮助:
http://geckohub.com/jquery/youtubeplaylist/ [ http://jquery-plugins.net/tag/youtube [

Use Jquery, you will get what you want to.
This may help you:
http://geckohub.com/jquery/youtubeplaylist/[^]

Or you can find the whole list for Youtube plug-in here:
http://jquery-plugins.net/tag/youtube[^]

这篇关于切换图库中的视频元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！