Ver Mensaje Individual
  #6 (permalink)  
Antiguo 20/06/2011, 12:01
Avatar de Naahuel
Naahuel
 
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 13 años, 1 mes
Puntos: 192
Respuesta: Slideshow de videos de YouTube

Bueno cargando el plugin al final funciona, después de cargar el gadget.

Para estilizarlo necesitás saber un poco de CSS. Mirá este ejemplo que te hice (Asegurate de cambiar las rutas de los scripts de easing y el slider)

Código HTML:
Ver original
  1. <!-- estilos necesarios -->
  2. *{margin:0; padding:0;} /*reset necesario*/
  3.  
  4. #videos-content ul,#videos-content{
  5.     width:640px;
  6.     height:400px;/*un poco mas de altura por el titulo*/
  7.     position:relative;
  8.     overflow:hidden;
  9. }
  10. #videos-content li {
  11.     width:640px;
  12.     height:400px;/*un poco mas de altura por el titulo*/
  13. }
  14. .botonAnterior, .botonSiguiente{
  15.     position:absolute;
  16.     top:50%;
  17. }
  18. .botonAnterior{left:0;}
  19. .botonSiguiente{right:0;}
  20.  
  21.  
  22. <div id="videos-content">
  23. </div>
  24. <script type="text/javascript">
  25. function showMyVideos(data) {
  26.   var feed = data.feed;
  27.   var entries = feed.entry || [];
  28.   var html = ['<ul>'];
  29.   for (var i = 0; i < entries.length; i++) {
  30.    var entry = entries[i];
  31.    var title = entry.title.$t;
  32.    var img = entries[i].media$group.media$thumbnail[0].url;
  33.    var yturl = entries[i].media$group.media$content[0].url;
  34.     //cambio en esta línea
  35.    html.push("<li><img src='" + img + "' /><p><a class='video-titulo' href='" + yturl + "' rel='shadowbox[HOME];width=640;height=388'>" + title + "</a></p></li>");
  36.   }
  37.   html.push('</ul>');
  38.   document.getElementById('videos-content').innerHTML = html.join('');
  39. }
  40. <script src="http://gdata.youtube.com/feeds/users/IDRIDPlanet/uploads?alt=json-in-script&amp;format=5&amp;callback=showMyVideos" type="text/javascript">
  41.  
  42. <!--jquery + easing-->
  43. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>
  44. <script src="jquery.easing.1.3.js"></script>
  45. <!--el plugin-->
  46. <script src="sliderFacil2000.v2.js"></script>
  47. $(function(){
  48.     $('#videos-content').sliderFacil2000({
  49.         easing : 'easeOutExpo',
  50.         auto: true,
  51.     });
  52. });

Observá que cambié un poco el enmarcado que estás generando con tu gadget para optimizarlo un poco :)
__________________
nahueljose.com.ar