YouTube embedded video: set different thumbnail

Question

I want to embed a video from YouTube that is not mine (so I can not change it at YouTube). The video has a thumbnail that is not representative for the video (I refer to the initial still that is shown when you embed a video, shown before the user plays it).

Is there a way to set the time of the still, for instance I tried passing ?s=XXX but this does not work. Or another way that comes natively with YouTube?

question from:https://stackoverflow.com/questions/7199624/youtube-embedded-video-set-different-thumbnail

Answer 1

There's a nice workaround for this in the sitepoint forums:

<div onclick="this.nextElementSibling.style.display='block'; this.style.display='none'">
   <img src="my_thumbnail.png" style="cursor:pointer" />
</div>
<div style="display:none">
    <!-- Embed code here -->
</div>

Note: To prevent having to click twice to make the video play, use autoplay=1 in the video embed code. It will start playing when the second div is displayed.