28% de descuento del curso en SQL Server

Estrada Web Group Estrada Web Group
Cambiar imagen de un video de Youtube
Estrada Web Group
Estrada Web Group
Estrada Web Group Estrada Web Group
Calificar:
13 enero Videos

¿Cómo cambiar la imagen de un video de Youtube?

¿Cómo cambiar la imagen de un video de Youtube?

youtube embed image customize

Como ya saben estoy desarrollando un administrador de proyectos y el que no sepa en seguida les dejo la liga http://www.mxprojectm.com, bueno en la construcción de este sistema me aventure hacer un video promocional del proyecto.

Cuando subí el video a YouTube me di cuenta que la imagen que aparecía por default era de muy baja calidad, por eso me di a la tarea de investigar cómo cambiar la imagen por default, no la imagen en miniatura esta es muy sencilla de cambiar y hay muchos ejemplos en internet.

 

El video quedaba de la siguiente manera:

cambiar imagen por default youtube

Y con el truco que se me ocurrió quedo así:

cambiar imagen que pone le youtube de baja calidad

Cuál es el truco, bueno utiliza dos contenedores "div", uno que contenga la imagen de vista previa y una que contenga el código de inserción del vídeo. El div que contiene el vídeo estará oculto y será visible cuando se hace clic en la imagen. La imagen debe ser del mismo tamaño que el video.

 

Código de ejemplo:

<div onclick="document.getElementById('vidoPromocional').style.display='block'; this.style.display='none'">                        
     <img src="assets/admin/layout/img/youtubePromocional.png"  style="cursor: pointer;  width:430px; height:250px; "/>
</div>
<div id="vidoPromocional" style="display:none">
      <iframe width="430" height="250" src="//www.youtube.com/embed/nFWx_FAmalA?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>
</div>

Esperamos que sea de tu agrado y sobre todo te sea de utilidad y te agradecería que nos dejaras tus comentarios en seguida.

Compartir:

Cargando...
Descarga el código fuente

Obten el código del sistema de gestión de proyectos.

Shape