Trong bài này chúng tôi sẽ hướng dẫn các bạn lấy ảnh đại diện của Youtube bằng Javascript.
Sử dụng iframe để chèn video youtube vào website sau:
<iframe width="420" height="315" src="www.youtube.com/embed/ypThsa-_wQ8" frameborder="0" allowfullscreen></iframe>
<div id=“show_thumb”>Show The thumbnail</div>
Dùng đoạn code sau để lấy id video của youtube:
var iframe = $('iframe:first');
var iframe_src = iframe.attr('src');
var youtube_video_id = iframe_src.match(/youtube\.com.*(\?v=|\/embed\/)(.{11})/).pop();
if (youtube_video_id.length == 11) {
var video_thumbnail = $('<img src="//img.youtube.com/vi/'+youtube_video_id+'/0.jpg">');
$('body').append(video_thumbnail);
$('img:first').click(function() {
$('iframe:first').fadeToggle('400');
});
}
Chúc các bạn thành công!
