Easy Youtube Video Thumbnail Downloader With jQuery
File Size: | 2.89 KB |
---|---|
Views Total: | 1079 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

A jQuery-powered Youtube thumbnail downloader app that allows you to get the high- and low-resolution thumbnails from a YouTube video.
See Also:
- jQuery Plugin To Get & Display Youtube Thumbnails
- jQuery Plugin To Create Animated Youtube Thumbnails - PreViewTube.js
How to use it:
1. Create an input field that accepts the Youtube video URL.
<input type="text" name="Link" />
2. Create a button to fetch Youtube video thumbnails.
<button class="btn"> Download </button>
3. Create two empty img
elements for the high- and low-resolution thumbnails.
<img src="https://" alt="" class="highres"> <img src="https://" alt="" class="lowres">
4. Load the required jQuery library at the end of the document.
<script src="/path/to/cdn/jquery.slim.min.js"></script>
5. The main function to fetch Youtube video thumbnails and display them on the page.
$(document).ready(function(){ $(".btn").click(function(){ var temp = $("input").val().split("=").pop(); var highres = "https://i.ytimg.com/vi/" + temp + "/maxresdefault.jpg"; var lowres = "https://i.ytimg.com/vi/" + temp + "/hqdefault.jpg"; // display HD Youtube Thumbnail $(".highres").attr('src' , highres); // display low-res Youtube Thumbnail $(".lowres").attr('src' , lowres); }); });
This awesome jQuery plugin is developed by firatkilinc7. For more Advanced Usages, please check the demo page or visit the official website.