youtube little

by poselab

HTML

<div class="videowrapper">
<div id="testVideo"></div>
</div>

CSS

.videowrapper{
    width:120px;
    height:65px;
    overflow:hidden;
}

JavaScript

// From http://apiblog.youtube.com/2011/01/introducing-javascript-player-api-for.html

 var ga = document.createElement('script');
 ga.type = 'text/javascript';
 ga.async = false;
 ga.src = 'http://www.youtube.com/player_api';
 var s = document.getElementsByTagName('head')[0];
 s.appendChild(ga);

 var done = false;
 var player;

 function onYouTubePlayerAPIReady() {
     player = new YT.Player('testVideo', {
         height: '200',
         width: '200',
         playerVars: { 'autoplay': 0, 
                      'controls': 0 },
         videoId: '-rMTExNTx2s',
         events: {
             'onReady': onPlayerReady
         }
     });
 }

 function onPlayerReady(evt) {
     setTimeout(newSize, 1000);
     evt.target.playVideo();
 }
 function newSize() {
     setPlayerSize(120, 65);
 }
function setPlayerSize(playerWidth, playerHeight) {
    player.setSize(playerWidth, playerHeight);
    document.getElementById('testVideo').width = playerWidth;
    document.getElementById('testVideo').height = playerHeight;
}