Embed google video or youtube with custom thumbnail

JavaScript
1

Does anyone know what I need to use a custom thumbnail when embedding youtube or google video?

Thanks in advance

2

I don’t think you can change the thumbnail.

But you can, display an image, and then the viewer click on it, replace that image with the video embed, auto start.

3

Would you mind giving me an example, I am not sure how to show an alternate image in the embed tag

Thanks in advance

4

I am not sure, but you can do something like this:

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

Excellent thank you the DtTvB - however this code doesn’t seem to work with Firefox. When you click the thumbnail it disappears and nothing else happens.

6

How to have a custom YouTube video thumbnail

I confirm the following code to work in IE 8, FF 3.5.3 and Safari 4.0.3:

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

<object width="425" height="344"><param name="movie" value="h**p://youtube.com/v/jxXukpxNSx4&hl=en&fs=1&autoplay=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="h**p://youtube.com/v/jxXukpxNSx4&hl=en&fs=1&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>

<!-- End Embed code -->

</div>

had to replace http with h**p so this from software does not complain.