0

Does anyone know if it's possible to define which video-frame is used as a preview, using the YouTube IFrame Player API?

When my video is embedded now, it shows a video-frame near the end of my video, while I want it to be one of the first frames.

DigiLive
  • 1,093
  • 1
  • 11
  • 28

2 Answers2

0

I don't think that this is possible using the API, but you could display the preview image yourself. This was discussed on following stackoverflow page: YouTube embedded video: set different thumbnail

Community
  • 1
  • 1
0

No. It's not (yet) possible.

But Niels his answer got me inspired. Actually his referral was about Youtube video's which are already embedded in the document, while the YouTube IFrame Player API embeds the video by javascript after the document has finished loading.

HTML part:

<div id="ytplayer">
    <img id="ytThumb" src="http://placehold.it/640x390&text=Play">
</div>

Javascript part:

$(document).ready(function(){
    $('#ytThumb').click(function() {
        //Embed the youtube player
        // Load the IFrame Player API code asynchronously.
        var tag = document.createElement('script');
        tag.src = "https://www.youtube.com/player_api";
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    });
});

// Replace the 'ytplayer' element with an <iframe> and
// YouTube player after the API code downloads.
function onYouTubeIframeAPIReady() {
    var player;
    player = new YT.Player('ytplayer', {
        height: '390',
        width: '640',
        videoId: 'M7lc1UVf-VE',
        playerVars: {
            'autoplay': 1,
            'rel': 0
        }
    });
}

While my container, image and video all have the same dimensions.

DigiLive
  • 1,093
  • 1
  • 11
  • 28