Player Video Youtube

Istruzioni per la configurazione del nostro player:

Nella sezione <head></head> inserisci lo stile css:

<style>
.titlec {
  font-size: small;
}
ul.videos li {
  float: left;
  width: 8em;
  margin-bottom: 1em;
}
ul.videos
{
  margin-bottom: 1em;
  padding-left : 0em;
  margin-left: 0em;
  list-style: none;
}
#tabbed_video {
  background:#aaa;
  float:left;
  height:250px;
  margin-left:0px;
  padding:10px;
  width:710px;
  border-radius: 10px;
}
#tabbed_video2 {
  background:#000;
  color:#fff;
  float:left;
  padding:10px;
  height:230px;
  width:390px;
}
</style>

Inserisci il codice javascript all'interno della pagina html, nel punto in cui il player dev'essere visualizzato:

<script type="text/javascript" src="http://swfobject.googlecode.com/svn/trunk/swfobject/swfobject.js"></script>
<script type="text/javascript">
function loadVideo(playerUrl, autoplay) {
  swfobject.embedSWF(
      playerUrl + '&rel=1&border=0&fs=1&autoplay=' +
      (autoplay?1:0), 'player', '300', '250', '9.0.0', false,
      false, {allowfullscreen: 'true'});
     }

function showMyVideos2(data) {
  var feed = data.feed;
  var entries = feed.entry || [];
  var html = ['<ul class="videos">'];
 
  for (var i = 0; i < entries.length; i++) {
    var entry = entries[i];
    var title = entry.title.$t.substr(0, 18);
    var thumbnailUrl = entries[i].media$group.media$thumbnail[0].url;
    var playerUrl = entries[i].media$group.media$content[0].url;
    html.push('<li onclick="loadVideo('', playerUrl, '', true)">',
              '<img src="', thumbnailUrl, '" width="110" height="75" border="1"/><br />');
    html.push('<span class="titlec"><b>', title, '...</b></span><br /></li>');
   

  }
  html.push('</ul><br style="clear: left;"/>');
  document.getElementById('videos2').innerHTML = html.join('');

 
  if (entries.length > 0) {
    loadVideo(entries[0].media$group.media$content[0].url, false);
  }
 
}
</script>

    <div id="tabbed_video">
      <div id="tabbed_video2">
        <font size="1">by <a href="http://www.sardiniatube.it">Sardiniatube</a> - <a href="sardinia.myblog.it/player-video-youtube.html">get player</a></font>
        <div id="videos2"></div>
      </div>
        <object id="player"></object>
    </div>
   
        <script
        type="text/javascript"
        src="http://gdata.youtube.com/feeds/api/videos?&q=sardinia&time=today&alt=json-in-script&callback=showMyVideos2&max-results=6&search_sort=video_view_count&uni=3&format=5">
        </script>
  

Personalizzazione. Il codice può essere personalizzato inserendo la query desiderata: individua sul codice la chiamata api "http://gdata.youtube.com/feeds/api/videos?&q=sardinia&time=today&alt=json-in-script&callback=showMyVideos2&max-results=6&search_sort=video_view_count&uni=3&format=5" e sostituisci q=sardinia con la query desiderata, ad es. q=musica, q=calcio+balsa ecc.

Condizioni di utilizzo. Questo player è realizzato seguendo le istruzioni dettate da Google/Youtube API. Il suo utilizzo è totalmente gratuito, saremmo grati se venissero mantenuti i nostri link all'interno del codice. Per informazioni contattare il web developer all'indirizzo sardiniatube@yahoo.it

DEMO-H

DEMO-V

Scritto da: gblogger Link permanente | Commenti (0)

I commenti sono chiusi