How to embedd multiple videos in a youtube player

I'm trying to create a simple youtube player that should show thumbnail of videos and should play them consecutively. I know youtube instant does this but the JS is minified so I can't make much sense of it. I'm not looking for a premade playlist that can be embedded into a player, because eventually I want to be able to add more videos through an ajax load. For now I am simply trying to have a player that can play two videos.

This is what I have so far: http://jsfiddle.net/V2nJG/4/

Answers


Here is a list of player parameters that you can pass to YouTube: http://code.google.com/apis/youtube/player_parameters.html

playlist

Value is a comma-separated list of video IDs to play. If you specify a value, the first video that plays will be the VIDEO_ID specified in the URL path, and the videos specified in the playlist parameter will play thereafter.

The link above is to the general YouTube documentation area, check-out the JavaScript API links (they will be very useful for learning how to interact with the player).

Also, using an <iframe> embed is easier and puts more of the hassle on YouTube's shoulders. For instance YouTube will decide how to output the video based on the device it's playing on.

Your embed code can be this simple:

<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0">
</iframe>

Source: http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html


Need Your Help

php - regex hostname extraction

php regex expression hostname

I have been looking around for a regex expression that will spit out just the 'stackoverflow' part and no www. or .com etc. All I could find was to check if the url's were valid... I have used php'...

Changing the color of a gradient on the fly

javascript jquery css plugins

I'm trying to change the hue/saturation/lightness of a linear gradient on the fly using jQuery. For some reason I just can't wrap my head around how this could be done. I'm using the jQuery gradient