Mostrando los Vídeos de forma más Ligera
Publicada el 16/08/2007 a las 10:08 y leída 1398 veces. 
Traducir ao galego.
A partir de ahora voy a intentar usar el método que utilicé en el post de Doug Henning para mostrar los videos en el blog.
Básicamente no mostrar el flash con el video directamente, sino que se muestra una imagen y al pulsar sobre ella lanza el Slimbox con el video en cuestión.
Para montar esto he usado la versión Slimbox Extended y le he añadido lo siguiente al script:
-
// En las líneas 184 y 192
-
this.preload.s = this.matchOrDefault(rev, new RegExp("scroll=(\\d+%?)", "i"), 1);
-
-
// En la línea 216
-
var ss = (this.preload.s == 1) ? "yes" : "no";
-
-
// En la línea 219
-
...scrolling:ss...
Así puedo usar la propiedad "rev" para indicarle, además del ancho y alto, si quiero que se vean las barras de scroll.
El segundo paso es crear la página que cargará el video. Para ello, nos creamos un PHP con el siguiente contenido:
-
<html>
-
<head>
-
<title>YouTube Video</title>
-
</head>
-
<body style="margin:0;padding:0;">
-
<?php
-
$video = $_GET['v'];
-
?>
-
<object width="480" height="368" type="application/x-shockwave-flash" data="http://www.youtube.com/v/">
-
<param name="movie" value="http://www.youtube.com/v/" />
-
</param></object>
-
<?php } ?>
-
</body>
-
</html>
Con esto ya solo nos quedaría meter en el post el código necesario para lanzar el Slimbox con el video. Como todos los videos de YouTube tienen una imagen "default.jpg" asociada, lo único que variará será el código del video. Un ejemplo sería:
-
<!-- Modificariamos el código 'JsTgQb7qcmo' por el de nuestro video -->
-
<a href="http://www.hnkweb.com/video/youtube.php?v=JsTgQb7qcmo" rev="width=480, height=370, scroll=0" rel="lightbox[]" title="Video de YouTube">
-
<img src="http://img.youtube.com/vi/JsTgQb7qcmo/default.jpg" alt="Pulsa para ver el video" />
-
</a>
Y el resultado sería:
