Efecto Visualizar videos mediante sus miniaturas. en JScript

Hola forobetas!.

Comentar que estoy buscando la manera de intentar simular este funcionamiento.

Aquí dejo la web de vídeos: WEB DE EFECTO PARA VER LOS VIDEOS

Bien me gustaría conseguir ese efecto de visualizar vídeos, es decir al hacer clic en un vídeo que hay en mi web, reproducirlo en una ventana aparte y mantener el resto de vídeos visibles (si ven se hace un espacio en medio para visualizar el vídeo y Si lo Cierras este desaparece).

Pienso es con JQuery o algo de JScript que se puede reailzar esto. 🙂


Si me pueden ayudar un poco o darme algunas ideas sobre que temas leer o ver, porque necesito un poco de ayuda con este tema ya que JQuery se lo básico y aún me queda mucho por aprender.

Un saludo a todos.

Hola amigo

No existe una forma directa de hacer lo que comentas en jquery y dependerá mucho de la maquetación de tu página web donde tendrás que aplicar conocmientos html y css aparte del código jquery. En base a como montes el html se hará de una forma u otra.

A grandes rasgos yo haría lo siguiente:
- Pones un <div> por cada linea con su clase por ejemplo "<div class="linea">
- Dentro de cada linea Pones cada miniatura en una capa <div> con una clase y un atributo data-id que contenga el ID del vídeo que contenga (ejemplo <div class="video" data-id="mi-id-de-video">)
- Pones un listener jquery sobre esa clase con $(".video").on() donde recojas el id del vídeo, accedes a la línea (parent=this.parent()) e inyectas el template que te contendrá el visualizador (parent.append())

Te recomiendo que ojees la web librosweb.es, donde encontrarás gran cantidad de información sobre HTML, CSS y jQuery

Espero haberte ayudado