Searching...
Tuesday, 1 January 2013

YouTube Player API Reference for iframe Embeds

The IFrame player API lets you embed aYouTube video player on your website and control the player using JavaScript. Unlike the Flash and JavaScript player APIs, which both involve embedding a Flash object on your web page, the IFrame API posts content to an <iframe> tag on your page. This approach provides more flexibility than the previouslyavailable APIs since it allows YouTube to serve an HTML5 player rather than a Flash player for mobile devices that do not support Flash.
Using the API's JavaScript functions, you can queue videos for playback; play, pause, or stop those videos; adjust the player volume; or retrieve information about the video being played. You can also add event listeners that will execute in response to certain player events, such as a player state change or a video playback quality change.

This guide explains how to use the IFrame API. It identifies the different types of events that the API can send and explains how to write event listeners to respond to those events. It also details the different JavaScript functions that you can call to control the video player as well as the player parameters you can use to further customize the player.

Requirements
The end user must be using a browser that supports the HTML5 postMessage feature. Most modern browsers support postMessage, though Internet Explorer 7 does not support it.

To allow room for critical player functionality, players must be at least 200px by 200px.

Any web page that uses the IFrame API must also implement the following JavaScript function:

onYouTubeIframeAPIReady – The API will call this function when the page has finisheddownloading the JavaScript for the player API, which enables you to then use the API on your page. Thus, this function might create the player objects that you want to display when the page loads.

Getting started
The sample HTML page below creates an embedded player that will load a video, play it for six seconds, and then stop the playback. The numbered comments in the HTML are explained inthe list below the example. Tool by : http://www.rnhckr.com


Ever wanted to?
  • Hide related Videos
  • Have an auto play video
  • Completely hide controls like the chromeless player
  • Auto hide video controls......when not hovering over over the video the controls disappear but hover over and it reappears 
  • Show info or hide it?
  • flexible control over width and height
No? well will this tool you can.
Tip: Check Live demo copy and Paste the given code into our Live Html editor
If You Like Don't Forgot to Share .. :)

0 comments:

Post a Comment