GALERIA DE VIDEOS YOUTUBE


<style type='text/css'>
.contvideogaleria img{width:100px;height:70px;padding:5px;border:0px solid #fff}
.contvideogaleria{position:relative;width:100%;float:left;display:block;background:white url(http://***/_WvACVGW1iPE/TUd0XZYq5fI/AAAAAAAABtY/QRDdhZwVuUk/s1600/youtube.png) no-repeat center left;}
.contvideogaleria .contvideogaleriaimg{margin:20px;/margin-bottom:10px;/margin-top:0;margin-left:30px;/margin-left:20px;margin-right:5px}
.contvideogaleria #videogaleria{width:100%;text-align: center;margin:20px;/margin:0;}
</style>

<div class="contvideogaleria">
<div id="videogaleria"></div>
<div class="contvideogaleriaimg">

<a href="http://www.youtube.com/v/gsahxhMmhnQ" onClick="return cambiarvideo(this.href)" title="Fiesta de mayo Huanuquillo 2010 Lima II"><img src="http://i4.ytimg.com/vi/gsahxhMmhnQ/default.jpg" /></a>

<a href="http://www.youtube.com/v/xoDMrR1-vnc" onClick="return cambiarvideo(this.href)" title="Fiesta de mayo Huanuquillo 2010 Lima"><img src="http://i1.ytimg.com/vi/xoDMrR1-vnc/default.jpg" /></a>

<a href="http://www.youtube.com/v/lqrDURFyA08" onClick="return cambiarvideo(this.href)" title="Carnavales Huanuquillo 2010 HD"><img src="http://i1.ytimg.com/vi/lqrDURFyA08/default.jpg" /></a>

<a href="http://www.youtube.com/v/6QTjp3J62g4" onClick="return cambiarvideo(this.href)" title="Carnavales Huanuquillo 2010 II HD"><img src="http://i3.ytimg.com/vi/6QTjp3J62g4/default.jpg" /></a>

<a href="http://www.youtube.com/v/cCyKItOUkQk" onClick="return cambiarvideo(this.href)" title="FIGHT Chutos de Huanuquillo 2010 HD"><img src="http://i4.ytimg.com/vi/cCyKItOUkQk/default.jpg" /></a>

<a href="http://www.youtube.com/v/VamVE_KViLk" onClick="return cambiarvideo(this.href)" title="FIGHT Chutos de Huanuquillo 2010 II HD"><img src="http://i3.ytimg.com/vi/VamVE_KViLk/default.jpg" /></a>

<a href="http://www.youtube.com/v/4luW_oHpurk" onClick="return cambiarvideo(this.href)" title="FIGHT Chutos de Huanuquillo 2010 III HD"><img src="http://i1.ytimg.com/vi/4luW_oHpurk/default.jpg" /></a>

<a href="http://www.youtube.com/v/GKZSYAIqLI8" onClick="return cambiarvideo(this.href)" title="Escuela Huanuquillo
"><img src="http://i4.ytimg.com/vi/GKZSYAIqLI8/default.jpg" /></a>

<a href="http://www.youtube.com/v/gZ69Lg8zcZc" onClick="return cambiarvideo(this.href)" title="carnavales 2010 II
"><img src="http://i4.ytimg.com/vi/gZ69Lg8zcZc/default.jpg" /></a>

<a href="http://www.youtube.com/v/dYSgpImCV-E" onClick="return cambiarvideo(this.href)" title="Tarma Carnavales 2010
"><img src="http://i1.ytimg.com/vi/dYSgpImCV-E/default.jpg" /></a>

<a href="http://www.youtube.com/v/UpXU6ToLW_Q" onClick="return cambiarvideo(this.href)" title="Documental Huanuquillo-Tarma part 1"><img src="http://i2.ytimg.com/vi/UpXU6ToLW_Q/default.jpg" /></a>

<a href="http://www.youtube.com/v/bHZa6HNaG4Q" onClick="return cambiarvideo(this.href)" title="Documental Huanuquillo-Tarma part 2"><img src="http://i3.ytimg.com/vi/bHZa6HNaG4Q/default.jpg" /></a>

<a href="http://www.youtube.com/v/ljAr4ywulHM" onClick="return cambiarvideo(this.href)" title="Documental Huanuquillo-Tarma part 3"><img src="http://i1.ytimg.com/vi/ljAr4ywulHM/default.jpg" /></a>

<a href="http://www.youtube.com/v/NATt1BqlUiI" onClick="return cambiarvideo(this.href)" title="Pachahuara"><img src="http://i3.ytimg.com/vi/NATt1BqlUiI/default.jpg" /></a>

<a href="http://www.youtube.com/v/yYm7waKucPs" onClick="return cambiarvideo(this.href)" title="Invitación Fiesta Negritos de Huanuquillo 2011"><img src="http://i2.ytimg.com/vi/yYm7waKucPs/default.jpg" /></a>

<a href="http://www.youtube.com/v/GNPqumUFq7E" onClick="return cambiarvideo(this.href)" title="Pachahuara - Huanuquillo 2009 - Tarma"><img src="http://i4.ytimg.com/vi/GNPqumUFq7E/default.jpg" /></a>

</div>

<!-- DE AQUÍ EN ADELANTE, NO TOCAR EL CÓDIGO -->
<a href="#" style="position:absolute; top: 15px; right: 15px;" target="_blank"><img style="width:14px; height:14px;border:0" src="#" /></a>
</div>

<script type="text/javascript">
// http://wowjalex.com
function cambiarvideo( url ){
document.getElementById('videogaleria').innerHTML = '<object width="425" height="344"><param name="movie" value="' + url + '?fs=1&amp;hl=es_ES&amp;rel=0&amp;autoplay=1"/><param value="true" name="allowFullScreen"/><param value="always" name="allowscriptaccess"/><param value="transparent" name="wmode"/><embed width="425" height="344" wmode="transparent" allowfullscreen="true" allowscriptaccess="always" type="application/x-shockwave-flash" src="' + url + '?fs=1&amp;hl=es_ES&amp;rel=0&amp;autoplay=1"/></object>';
return false;
}

</script>





COMO LO MODIFICO?

Solo deben sustituir los últimos parámetros de los videos ejemplo:

Si este es tu video de YouTube, toma los últimos parámetros que aparecen y

http://www.youtube.com/watch?v= GNPqumUFq7E


Colócalos en lugar de los que están en el código, ejemplo:



<a href="http://www.youtube.com/v/ GNPqumUFq7E " onClick="return cambiarvideo(this.href)" title="Fiesta de mayo Huanuquillo 2010 Lima II"><img src="http://i4.ytimg.com/vi/gsahxhMmhnQ/default.jpg" /></a>

Para sustituir el nombre, solo digita lo queprefieres que salga en la parte del (TITLE), ejemplo:


<a href="http://www.youtube.com/v/ GNPqumUFq7E " onClick="return cambiarvideo(this.href)" title="Fiesta de mayo Huanuquillo 2010 Lima II"><img src="http://i4.ytimg.com/vi/gsahxhMmhnQ/default.jpg" /></a>



Y para las imágenes, has click derecho sobre los videos miniaturas que aparecen en YouTube, esto te mostrara una opción llamada (COPIAR URL DE IMAGEN), este lo colocas en lugar de:


<a href="http://www.youtube.com/v/ GNPqumUFq7E " onClick="return cambiarvideo(this.href)" title="Fiesta de mayo Huanuquillo 2010 Lima II"><img src="http://i4.ytimg.com/vi/gsahxhMmhnQ/default.jpg" /></a>





Espero les guste, Youtube en tu Web suerte amigos!