on click play youtube video

I found a script that allows to plays the youtube video on one click. The reason for this is so I can have a custom image on top of the youtube video.

When the user clicks on the video (which is an image placed on top of the video) the image disappears and the youtube video starts to play…

Here is the code

HTML and javascript

[code=html]<div id=”vid1″>
<a href=”javascript:void(0);” onclick=”play();”>
<img id=”thumb” onClick=”document.getElementById(‘thumb’).style.display=’none'” src=”video.jpg” />
</a>

<div id=”ytapiplayer”></div>
<script type=”text/javascript”>

var atts = { id: “myytplayer” };
swfobject.embedSWF(“http://www.youtube.com/video”,
“ytapiplayer”, “640”, “480”, “8”, null, null, params, atts);

</script>

</div>[/code]

Javascript:

[CODE] function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}

function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById(“myytplayer”);
setInterval(updateytplayerInfo, 250);
updateytplayerInfo();
ytplayer.addEventListener(“onStateChange”, “onytplayerStateChange”);
ytplayer.addEventListener(“onError”, “onPlayerError”);
}

function play() {
if (ytplayer) {
ytplayer.playVideo();
}
}

[/CODE]

How can I add two videos on one page? I can only get one to work on a page and not two (or more)

I tried this code

[CODE]
function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}

function onYouTubePlayerReady(playerId) {
ytplayer2 = document.getElementById(“myytplayer2”);
setInterval(updateytplayerInfo, 250);
updateytplayerInfo();
ytplayer2.addEventListener(“onStateChange”, “onytplayerStateChange”);
ytplayer2.addEventListener(“onError”, “onPlayerError”);
}

function play() {
if (ytplayer2) {
ytplayer2.playVideo();
}
}[/CODE]

I have also changed the id in the HTML/javascript shown above…
I can get both videos to work separately but not together. By this I mean when I click on video 1 the image disappears and the video plays…
But if I click on video 2, the image disappears and I have to click again after the image disappears to play the video – it doesn’t play on the one click…

Hope this makes sense.

Can anyone help?

Also in #JavaScript _↴