menardmam menardmam - 6 months ago 7x
Javascript Question

How to change the video playing in Youtube embedded player?

I'd like to make a playlist, where a click on each

will change the video link just below. The list will look like this:

  • video1

    <li><a href="MzfAvHlIVjE&hl=en&fs=1&rel=0&color1=0x3a3a3a&color2=0x999999">">video1</a></li>

  • bbbbb

  • ccccc

video player here

So clicking on aaaaa will play aaaaa , clicking on bbbbb will play bbbbb, etc.

I'd like to make it ajax, without redraw, just clic and play.

Here is the youtube object to edit

<object width="320" height="265">
<param name="movie" value=""></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="320" height="265"></embed>

How can I change the video playing in Youtube embedded player ?


If you dun like the popup just get rid of it:

function play(id)
       var html  = '';

       html += '<object >';
       html += '<param name="movie" value="'+id+'"></param>';
       html += '<param name="autoplay" value="1">';
       html += '<param name="wmode" value="transparent"></param>';
       html += '<embed src="'+id+'&autoplay=1" type="application/x-shockwave-flash" wmode="transparent" ></embed>';
       html += '</object>';

       return html;

<div id="button1" />
<div id="playvideo" />

$("#button1").click(function() { $("#playvideo").html(play("YOURVIDEOID")); });

Hope this helps