meta data:

*metadata are parameters setted in the class attribute of the TAG.

• opacity: (int) 0 → 1;
• isBgndMovie: {width:'1990',mute:false} // or false or true (in this case the movie will be width: '100%' and mute:true by default);
• ratio: '4/3' // or "16/9" to set the aspect ratio of the movie;
• quality: 'default' // or "small", "medium", "large", "hd720"; (not implemented yet);
• muteSound: true // or false (not implemented yet);
• hasControls: true // or false (not implemented yet);
• bufferImg: (string) Path to an image you whant to show while buffering;
• ID: (string) the ID of the DOM element where you want the video background; if not specified it takes the "body".

For example:

<a id="bgndVideo" href="http://www.youtube.com/watch?v=MR9av-I35ME" class="movie {opacity:.4, isBgndMovie:{width:'1990',mute:false}, ratio:'4/3', quality:"hd720"}">Bill Viola</a>

Using jquery.mb.YTPlayer:

To initialize a YTPlayer as simple player:

• set the meta data isBgndMovie of A tag to false;
• set as HREF the url of the Youtube movie;
• initialize the element or the elements: $(".movie").mb_YTPlayer();

To initialize a YTPlayer as background:

• set the meta data isBgndMovie of A tag to true;
• set as HREF the url of the Youtube movie;
• set the opacity, the width, mute and the quality as meta data;
• initialize the element or the elements: $(".movie").mb_YTPlayer();

To initialize a YTPlayer as element background (from v. 1.2.1):

• set the meta data isBgndMovie of A tag to true;
• set as HREF the url of the Youtube movie;
• set the opacity, the width, mute, the quality and the ID of the element you want as target of the background movie as meta data;
• initialize the element or the elements: $(".movie").mb_YTPlayer().