Ayuda con javascript porfavor.

Iniciado por HDS02, 14 Octubre 2010, 02:23 AM

0 Miembros y 1 Visitante están viendo este tema.

HDS02

Hola a todos..

Espero y me puedan ayudar con este codigo que me esta volviendo loco... yo no conozco mucho este lenguaje (javascript), y quiero modificar un pequeño codigo, que yo creo no es muy complicado. El codigo toma la imagen miniatura de un video de youtube y la muestra en un div, el problema es que yo quiero redimencionar esa imagen pero no se como, ya le intente de varias formas y no me sale, aqui el codigo...

Código (javascript) [Seleccionar]
jQuery.fn.ytplaylist = function(options) {

 // default settings
 var options = jQuery.extend( {
   holderId: 'ytvideo',
playerHeight: '280',
playerWidth: '325',
addThumbs: false,
thumbSize: 'small',
showInline: false,
autoPlay: true,
showRelated: true,
allowFullScreen: false
 },options);

 return this.each(function() {

  var selector = $(this);

var autoPlay = "";
var showRelated = "&rel=0";
var fullScreen = "";
if(options.autoPlay) autoPlay = "&autoplay=1";
if(options.showRelated) showRelated = "&rel=1";
if(options.allowFullScreen) fullScreen = "&fs=1";

//throw a youtube player in
function play(id)
{
  var html  = '';

  html += '<object height="'+options.playerHeight+'" width="'+options.playerWidth+'">';
  html += '<param name="movie" value="http://www.youtube.com/v/'+id+autoPlay+showRelated+fullScreen+'"> </param>';
  html += '<param name="wmode" value="transparent"> </param>';
  if(options.allowFullScreen) {
  html += '<param name="allowfullscreen" value="true"> </param>';
  }
  html += '<embed src="http://www.youtube.com/v/'+id+autoPlay+showRelated+fullScreen+'"';
  if(options.allowFullScreen) {
  html += ' allowfullscreen="true" ';
  }
  html += 'type="application/x-shockwave-flash" wmode="transparent"  height="'+options.playerHeight+'" width="'+options.playerWidth+'"></embed>';
  html += '</object>';

  return html;
 
};


//grab a youtube id from a (clean, no querystring) url (thanks to http://jquery-howto.blogspot.com/2009/05/jyoutube-jquery-youtube-thumbnail.html)
function youtubeid(url) {
var ytid = url.match("[\\?&]v=([^&#]*)");
ytid = ytid[1];
return ytid;
};


//load inital video
var firstVid = selector.children("li:first-child").addClass("currentvideo").children("a").attr("href");
$("#"+options.holderId+"").html(play(youtubeid(firstVid)));

//load video on request
selector.children("li").children("a").click(function() {

if(options.showInline) {
$("li.currentvideo").removeClass("currentvideo");
$(this).parent("li").addClass("currentvideo").html(play(youtubeid($(this).attr("href"))));
}
else {
$("#"+options.holderId+"").html(play(youtubeid($(this).attr("href"))));
$(this).parent().parent("ul").find("li.currentvideo").removeClass("currentvideo");
$(this).parent("li").addClass("currentvideo");
}



return false;
});


if(options.addThumbs) {

selector.children().each(function(i){
 
var replacedText = $(this).text();

if(options.thumbSize == 'small') {

var thumbUrl = "http://img.youtube.com/vi/"+youtubeid($(this).children("a").attr("href"))+"/2.jpg";
}
else {
var thumbUrl = "http://img.youtube.com/vi/"+youtubeid($(this).children("a").attr("href"))+"/0.jpg";
}


$(this).children("a").empty().html("<img src='"+thumbUrl+"' alt='"+replacedText+"' />"+replacedText).attr("title", replacedText);

});

}


 });

};



creo yo, la parte donde se tienen que poner los parametros es en esta parte del codigo:

$(this).children("a").empty().html("<img src='"+thumbUrl+"' alt='"+replacedText+"' />"+replacedText).attr("title", replacedText);

pero ya intente de varias formas y nomas no me funciona, espero alguien me puedan echar la mano.. se lo agradeceria mucho.

Gracias.

Shell Root

Pero si te fijas, podes sacar la imagen directamente desde las imágenes de YOUTUBE. Así, supongamos que el video sea el siguiente,
Código (php) [Seleccionar]
"http://www.youtube.com/watch?v=".ZyvZ6sLfj2k;
para ver el THUMB es así,
Código (php) [Seleccionar]
"http://img.youtube.com/vi/".ZyvZ6sLfj2k."/default.jpg";

Supongo que deberías de agregarle esto,
Código (javascript) [Seleccionar]
$(this).children("a").empty().html(
 "<img src='"+thumbUrl+"' alt='"+replacedText+"' height = '580' width= '525' />"+replacedText
).attr(
 "title", replacedText
);
Por eso no duermo, por si tras mi ventana hay un cuervo. Cuelgo de hilos sueltos sabiendo que hay veneno en el aire.

HDS02

K tal,

Gracias por responder tan rápido, mira efectivamente funciona, pero solo con "heigh" osea, solo me cambia ese valor, el otro width no me lo respeta.. el código lo tengo lo tengo exactamente asi.

$(this).children("a").empty().html("<img src='"+thumbUrl+"' height='100' width='100' alt='"+replacedText+"' />"+replacedText).attr("title", replacedText);

sabrás a que se deba??

gracias.


Shell Root

Pues la verdad, ni idea. --Mi cerebro esta en otra cosa ahora--, de igual forma, solo puedo decirte, de que pondle lo siguiente,
Código (javascript) [Seleccionar]
$(this).children("a").empty().html(
  "<img src='"+thumbUrl+"' alt='"+replacedText+"' height = '580px' width= '525px' />"+replacedText
).attr(
  "title", replacedText
);
Por eso no duermo, por si tras mi ventana hay un cuervo. Cuelgo de hilos sueltos sabiendo que hay veneno en el aire.

HDS02

Ok,

Gracias, de igual forma me ayudaste mucho, deja ver si puedo arreglar ese pequeño error ya es mas fácil..

saludos.