jQuery Plugin For Youtube & Vimeo Video Previews - PreVideoLoad

PreVideoLoad is a super tiny jQuery plugin that gets and displays thumbnail previews of the Youtube or Vimeo videos on the web page. When you click on the play button, the preview image will be replaced by the autoplaying iframe Youtube or Vimeo video.

Basic usage:

1. Load jQuery library and the jQuery PreVideoLoad plugin's files in the document.

<link rel="stylesheet" href="prevideoload.css">
<script src="jquery.min.js"></script>
<script src="prevideoload.min.js"></script>

2. Embed an Youtube video with a thumbnail preview into your webpage.

<div class="PreVideoLoad PreYoutube" 
     data-videoid="yOcPZvFd1k8">
</div>

3. Embed an Vimeo video with a thumbnail preview into your webpage.

<div class="PreVideoLoad PreVimeo" 
     data-videoid="136084531">
</div>

4. Initialize the plugin and done.

$('.PreVideoLoad').PreVideoLoad();

5. Customization options with defaults.

// play the video after the event is launched
autoPlay: true,

// when to load video
event: 'click',

// quality of youtube's video thumbnail. 
// Can be: 0 (full-size) | 1 | 2 | 3 | default | hqdefault | mqdefault | sddefault | maxresdefault (max-resolution)
ytimg: '0',

// quality of vimeo's video thumbnail. 
// Can be: small | medium | large
vmimg: 'large',

// cache vimeo's video thumbnail
vmcache: true

---

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