Fast Responsive Video Gallery Plugin For jQuery - speedvault.js

speedvault.js is a jQuery plugin for creating a responsive, performant video gallery to lazy load and play videos from Youtube, Vimeo, and DailyMotion.

How to use it:

1. Put jQuery library and the speedvault.js plugin's JavaScript & CSS files in the webpage.

<link rel="stylesheet" href="css/svvg-styles.css">
<script src="jquery.min.js"></script>
<script src="js/speedvault.js"></script>

2. Create a list of video links and specify the video ID using data-videoID attribute as this:

<ul id="svList">
  <li class="svThumb ytVideo" data-videoID="yxbDwGMVZlU">EXQUISITE ZOMBIES "Stampede" | Yak Films x Adobe Project 1324 x 2016 Sundance Film Festival</li>
  <li class="svThumb ytVideo" data-videoID="Ar3KbfLTVeg">Blue Journey</li>
  <li class="svThumb vimeoVideo" data-videoID="181907337">Hayley Vimeo</li>
  <li class="svThumb vimeoVideo" data-videoID="24195442">Carving the Mountains</li>
  <li class="svThumb ytVideo" data-videoID="3k1nP34vRU4">Barbixas - Improvável: Quadrado Improvável #16</li>
  <li class="svThumb ytVideo" data-videoID="f0xyzj545tc">GoPro: Epic Roof Jump</li>
  <li class="svThumb ytVideo" data-videoID="SOToC41dplY">SUPERHAWT - RocketJump</li>
  <li class="svThumb ytVideo" data-videoID="bLE7zsJk4AI">Worst Wifi Password Ever</li>
  <li class="svThumb dailyMVideo" data-videoID="x2v2fky">French Foreign Legion - La Légion Étrangère Recrute</li>
  <li class="svThumb vimeoVideo" data-videoID="199940193">Fired Up</li>
  <li class="svThumb vimeoVideo" data-videoID="21661244">WE TRUST - Time (Better not stop)</li>
  <li class="svThumb ytVideo" data-videoID="H0Ib9SwC7EI">Superman With a GoPro</li>
  <li class="svThumb ytVideo" data-videoID="ZkqenksqHtA">Destroying rubber on a touge-style track in Japan (w/ Alexi Smith, one of America's Formula Drift Judges)</li>
  <li class="svThumb ytVideo" data-videoID="qm2HjyJx8zU">Ultimate Dance Challenge: theGABBIEshow</li>
  <li class="svThumb ytVideo" data-videoID="ocH3wWBwcNA">Barbixas - Improvável: Jogo Do Troca #59</li>
  <li class="svThumb vimeoVideo" data-videoID="35557633">Endless Roads 3 - Land of Castles</li>
  <li class="svThumb ytVideo" data-videoID="opji5DgE_nQ">Dragon Ball Z: Light of Hope - Pilot</li>
  <li class="svThumb ytVideo" data-videoID="Ez6v6RsF_h0">Urban Mountain Bike Madness in Peru</li>
  <li class="svThumb ytVideo" data-videoID="3GNG12g2bKw">Les Twins | FRONTROW | World of Dance 2014 #WODHI</li>
  <li class="svThumb ytVideo" data-videoID="pJVvbTAx8_Y">Kacem Wapalek - Vingt sur vingt</li>
  <li class="svThumb ytVideo" data-videoID="8gUDsPj33vE">Buraka Som Sistema - Vuvuzela (Carnaval)</li>
  <li class="svThumb ytVideo" data-videoID="Zk9J5xnTVMA">Road to Machu Picchu - Peru in 4K</li>
  <li class="svThumb ytVideo" data-videoID="jRTDY7EhOMY">600+HP RWD Lancer EVO, Anti-Lag Sounds & Drifting</li>
  <li class="svThumb vimeoVideo" data-videoID="97253393">Ryan Tuerck @ Reisbrennen 2014</li>
</ul>

---

This awesome jQuery plugin is developed by blackMec. For more Advanced Usages, please check the demo page or visit the official website.