JMiur [E]

¡Epa! ¡Esto sí que funciona muy bien!

Tanto dar vueltas buscando algún tipo de script que permita utilizar algún tipo de ventana modal al estilo VideoBox, LightBox, PopBox o SlimBox que funcione correctamente y que sea lo suficientemente versátil como para permitir mostrar todo tipo de archivos y aquí esta, se llama LightWindow.

¿Por que me parece que esta es mejor que todas las otras que he probado? Porque, entre otras cosas pueden mostrarse imágenes, videos de distintos servicios, archivos de Flash, galerías, etc.

Esto de mostrar contenido en ventanas modales es muy lindo pero también es molesto tener que elegir uno u otro modelo porque cada uno de ellos hace algo diferente, uno para videos, otro para imágenes, ni hablar de compatibilidades. LightWindow tiene la particularidad de poder manejar prácticamente cualquier tipo de archivo multimedia y los detecta automáticamente. Además, es compatible con Firefox, IE6, IE7, Safari y Opera tanto en Windows como en Mac.

La ventana puede personalizarse todo lo que uno quiera y podemos crear galerías con cualquier tipo de archivo, colocar títulos, descripciones, etc.

Primero que nada, descargamos el ZIP que contiene una serie de archivos y carpetas que incluyen demostraciones varias. De todos ellos, los que necesitamos alojar en un servidor propio son:

prototype.js
scriptaculous.js
effects.js
lightwindow.js
lightwindow.css

Como el framework prototype es de uso bastante común y se emplea para diversas funciones y trucos, si ya lo hemos incluido en nuestra plantilla no deberemos preocuparnos y utilizamos el que tenemos; a lo sumo, verificamos si la versión es adecuada y si no, la reemplazamos por una más nueva. Lo mismo puede decirse de script.aculo.us y de su librería effects.

Los otros dos archivos, lightwindow.js y lightwindow.css son los que nos importan y los que pueden modificarse para adaptarse a nuestras necesidades. Por ejemplo, deberíamos alojar las imágenes utilizadas y cambiar las direcciones de: ajax-loading.gif, black.png, black-70.png, arrow-down.gif, arrow-up.gif, prevlabel.gif y nextlabel.gif.

Una vez que tenemos alojados los archivos, los incluimos en la plantilla, por ejemplo, justo antes de </head>:
<script type="text/javascript" src="URL_prototype.js"></script>
<script type="text/javascript" src="URL_scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="URL_lightwindow.js"></script>
<link rel="stylesheet" href="URL_lightwindow.css" type="text/css" media="screen" />

Donde cambiamos las direcciones URL por las de nuestros archivos.

El script es muy sencillo de utilizar, basta agregar la clase lightwindow a cualquier enlace, por ejemplo:
<a href="URL_archivo" class="lightwindow">ENLACE</a>
El enlace puede ser tanto un texto, como un ícono o una miniatura.

En realidad, eso es todo, no hace falta nada más, de manera automática, el script reconocerá el tipo de archivo al que se refiere el enlace y actuará en consecuencia.
  • Imágenes en formato bmp, gif, jpg, png y tiff
  • Videos en formato avi, divx, m1v, m2v, mjpg, moov, mov, movie, mpa, mpe, mpeg, mpg, qt, viv, vivo y wmv.
  • Audio en formato aif, aiff, m2a, m3u, mid, midi, mp2, mp3, mpa, mpg, mpga, ram y wav.
  • Páginas en formato asp, aspx, cgi, htm, html, pl, php4, php3, php, php5, phtml, rb, rhtml, shtml, txt, y vbs.
  • Aplicaciones en formato asf, pdf, pps, rm y swf.

Por supuesto, el navegador tendrá que tener los plugins necesarios para verlos y, eventualmente (por ejemplo en el caso del divx), habrá que modificar el script para que cargue los códigos necesarios. En la página principal del proyecto, hay una descripción de las instrucciones utilizadas, los tipos MIME soportados y los plugins y ActiveX establecidos por defecto.

Para crea una galería, el criterio es el mismo, ponemos enlaces a cada uno de los archivo y les agregamos a todos ellos un atributo REL con el mismo valor, por ejemplo:
<a href="URL_archivo1" class="lightwindow" rel="TítuloDemo[Subtítulo]">ENLACE 1</a>
<a href="URL_archivo2" class="lightwindow" rel="TítuloDemo[Subtítulo]">ENLACE 2</a>
<a href="URL_archivo3" class="lightwindow" rel="TítuloDemo[Subtítulo]">ENLACE 3</a>
Y si sólo queremos mostrar un enlace:
<a href="URL_archivo1" class="lightwindow" rel="TítuloDemo[Subtítulo]">ENLACE</a>
<a href="URL_archivo2" class="lightwindow" rel="TítuloDemo[Subtítulo]"></a>
<a href="URL_archivo3" class="lightwindow" rel="TítuloDemo[Subtítulo]"></a>

Si bien la forma sencilla es agregar la clase lightwindow al enlace, hay otras propiedades con las que podemos personalizar cada enlace, para esto, usamos el atributo PARAMS:
<a class="lightwindow" href="URL_arhivo" params="lista de parámetros">ENLACE</a>
Los parámetros que podemos usar son:

lightwindow_width es el ancho de la ventana (en pixeles)
lightwindow_height es el alto de la ventana (en pixeles)
lightwindow_top es la distancia entre el borde superior de la pantalla y el inicio de la ventana
lightwindow_left es la distancia entre el borde izquierdo de la pantalla y el inicio de la ventana
lightwindow_loading_animation se establece en false para no mostrar el efecto fade al cargarse

Otros parámetros son específicos para casos especiales:

lightwindow_show_images indica la cantidad de imágenes a mostrar simultáneamente en una galería (el valor por defecto es 1)
lightwindow_type es optativo e indica cómo debe ser interpretado el enlace (page, external, image, media, inline)
lightwindow_iframe_embed se utiliza para incrustar el medio dentro de un IFRAME en lugar de un DIV
lightwindow_form indica el nombre si estamos utilizando el script para mostrar un formulario

Si queremos usar varios parámetros, los separamos por comas, por ejemplo:
params=lightwindow_width=425,lightwindow_height=350,lightwindow_loading_animation=true"

params="lightwindow_width=500,lightwindow_height=500,lightwindow_show_images=2"
Otros atributos especiales son también opcionales: title, author y caption se utilizan para mostrar determinados textos.
<a class="lightwindow" href="URL_archivo"
title="unTexto"
caption="unTexto"
author="unTexto"
params="lista de parámetros">ENLACE</a>
También podemos colocar contenido inline ¿qué es esto? Pués podemos mostrar algo que tenemos en nuestra propia página o post, algo que "ocultamos" y sólo mostramos a través de un enlace:
<a href="#nombreID"  class="lightwindow">ENLACE</a>
<div id="nombreID" style="display: none;">
<div>... cualquier contenido HTML ...</div>
</div>
Algunas propiedades que pueden personalizarse:

#lightwindow_title_bar el área superior donde se muestra el atributo TITLE y el enlace que permite cerrar la ventana
#lightwindow_title_bar_title es el texto del atributo TITLE
#lightwindow_title_bar_close_link es el enlace con el texto "close"
#lightwindow_data_caption es el texto del atributo CAPTION
#lightwindow_data_author es el texto del atributo AUTHOR

Esto lo podemos hacer modificando el archivo lightwindow.css o sobrescribiéndolo en nuestra plantilla, agregando una etiqueta STYLE inmediantamente después del enlace a la hoja de estilo:
<link rel="stylesheet" href="URL_lightwindow.css" type="text/css" media="screen" />
<style type='text/css'>
#lightwindow_title_bar_title { ... }
a#lightwindow_title_bar_close_link, a:link#lightwindow_title_bar_close_link, 
a:visited#lightwindow_title_bar_close_link { ... }
a:hover#lightwindow_title_bar_close_link,  a:active#lightwindow_title_bar_close_link { ... }
#lightwindow_data_caption { ... }
#lightwindow_data_author { ... }
</style>

502 comentarios:

Eduardo Peinado  

¡Vaya pasada!

Aunque creo que me va a costar un poco agregarlo en mi plantilla, porque soy torpón para esto.

Pero como siga viendo opciones y recursos para añadir no voy a terminar nunca. Pero este es una pasada.

Una cosa Jmiur, para los que no entienden como yo. Si no pongo valores para ajusto el tamaño de la clase ligh... para cada foto o vídeo que publique, ¿se ajusta al tamaño del documento de forma automática, o tengo que personalizar las medidas para cada archivo?

Un abrazo y ya no te doy más las gracias, te invito a la Feria de Abril de Sevilla y ya está, jeje.

Anónimo  

Vaya lástima q' no se pueda abrir en Opera el video de YouTube. Y ojala q' eso no ocurra con Firefox

La Blogueria  

¡Genial! Gracias especiales por el ZIP con los archivos modificados y las imágenes alojadas, vaya detalle; me hizo pensar en la web http://jscripts.ning.com/ que te permite alojar archivos js u obtener la url de archivos ya alojados, y que además comprime o minimiza el script para que tarde menos la carga... Me gustaría saber tu opinión sobre si podría ser útil ofrecer estas url directamente, como con las de las imágenes.

El lightwindow, además de espectacular, sencillo. ¡Una pasada!

Gracias JMiur, saludos calurosos.

Anónimo  

Hola, yo tengo una duda. Resulta que estoy haciendo una pagina que tiene un menu en la parte superior en flash. En la parte central de la pagina he puesto un link con lightwindow en el que se me abre una imagen. Hasta ahi todo bien. El problema surge cuando esa imagen se superpone sobre el fondo de la pagina pero no sobre el menu flash de la parte superior, es decir queda tapada parte de la imagen por ese menu. Tengo todo en un solo marco y me estoy volviendo un poco loco. No se si tendre que cambiar mi menu y hacerlo con imagenes...Gracias por la ayuda

Anónimo  

JMiur en la parte donde escribes este tipo de codigo esta mal los cierres, ten cuidado no vaya a ser q' un principiante se pierda saludos desde Peru.
(script type="text/javascript" src="URL_prototype.js"<>/script)

Gem@  

Fantástico ha valido la pena la espera, menuda tarea me has preparado :)

Buen ojo Edwar eso le pasa a los mejores maestros por no utilizar el copia y pega ;)

Anónimo  

Lo estoy empezando a utilizar y es bien pesadito el script o sera solo mi impresión, debo esperar cierto tiempo como q' carga el script para q recine funciones sino carga el archivo en la misma pagina.

JMiur  

Eduardo:
No hace falta establecer el tamaño de cada ventana, de manera automática se ajusta al contenido, Eso es así en imágenes, videos y multimedia en general salvo uno que otro caso especial así que con solo incluir class="lightwindow" en el enlace, es suficiente.

David:
Por lo que he podido ver, funciona tanto en Firefox como IE pero tambien en Opera (ver captura)

La Bloguería:
No conocía el sitio http://jscripts.ning.com/ y le daré una mirada. Habría que ver las condiciones del servicio, ancho de banda disponible, velocidad de carga, etc. Así a simple vista, parece una alternativa interesante como alternativa, tal vez, ofrecer ambas cosas, el ZIP para quien quiera alojarlo por su cuenta y un enlace directo.

Beto:
Si, ese tipo de problemas surge cuando se superponen este tipo de ventanas modales con otros archivos de Flash. Lo he notado en casi todas las variantes. La verdad, no sé si tiene solución.

Edwar:
Gracias por el aviso, ya está corregido :$
El script es relativamente pesado, eso depende de muchas cosas iincluyendo gustos :)
Personalmente, me atrae porque me permitirá reemplazar otros y allí veremos.
En cualquier caso, todos estos scripts requieren que la página esté completamente cargada para funcionar

Gem@:
Sí, a cualquier cazador se le escapa la liebre y a veces, más de una :D

Anónimo  

Gracias por este Script JMiur,

el único problema que le veo es que con los videos de google se abre la ventana pero no hay manera de reproducir el video... es un defecto del Script o se me a pasado alguna cosa?

Gracias!

Anónimo  

se me olvido comentar que con el único navegador que da problemas es con Firefox, con el explorer y Opera carga perfecto, pero con Firefox no hay manera.

JMiur  

Es evidente que este tipo de script tan complejo y sobre todo cuando se usan frameworks, puede producir conflictos y, sobre todo incompatibilidades con otros. Por ejemplo, es normal que no puedan usarse jquery, mootools y prototype juntos.

Uso Firefox normalmente y no he encontrado problemas de ninguna clase y el video lo puedo reproducir normalmente.

En casos así, sugiero usar un blog de pruebas, libre de otros scripts para ver si ocurre lo mismo. Realmente desconozco el motivo por qué, dos personas, usando el mismo navegador puedan tener resultados diferentes.

Anónimo  

Gracias por la repuesta, pero si fuese por algún tipo de conflicto con otro Script me podria dar problemas en mi blog pero es en el ejemplo que pusiste con google tampoco pude verlo... Pero si dices que a ti no te da problemas entonces seguro que sera cosa mia, gracias por todo.

JMiur  

Entonces, todavía es más raro aún ¿verdad? No comprendo cuál puede ser el problema pero, buscaré en la web a ver si encuentro alguna respuesta.

Por casualidad, ¿has probado entrar en la página oficial y ver si allí tampoco funciona?

Anónimo  

si, pero creo que no tienen un ejemplo especifico para google video... Pero si no me falla la memoria creo que la primera vez que probe el script en tu blog se cargo correctamente, pero no estoy seguro del todo, igualmente seguiré probando hasta solucionarlo.

Claudio - Poca Tinta  

Hola Jmuir, interesante este script como mencionas en tu titulo casi, casi perfecto. No lo he probado solo he corrido tu post en diferentes navegdores, te comento que:
- Desde mi pc se vee bien en Safari, lo que me agrada ya que lo estoy usando con reguraridad, que pena que el resto no.
- Con Firefox algunos se traban, me solicita plugins que los instalo y corren, otros no los muestran, hay una diferencia con safari en el tamaño en que se muestran los videos o imagenes.
- En IE7 al darle click en los enlaces intenta descargar las imagenes.
- En el opera sucede lo mismo que en Firefox.

Tengo las versiones actualizadas, el scrip me parece facinante, lo probare en una pagina de prueba.
Saludos

Marcos Horro Varela  

Ostras...¡te lo curras JMiur!

Tiene muy buena pinta , a parte de que tus explicaciones son muy buenas xD.

Voy a probarlo y te digo mi opinión y que tal me va!

Saludos

JMiur  

Suerte Markos :D

Claudio:
Lo de Safari, es bueno confirmarlo porque no lo tengo instalado. En los demás, es posible que falten instalar plugins (Quicktime, Windows Media Player, etc) ya que, por defecto, no vienen.

En IE7 no veo problemas pero puede ser algo de la configuración del mismo navegador, algo que tenga que ver con el bloqueo de scripts. No conozco bien ese navegador.

admin  

Exelente explicacion J.Miur , tengo una duda , si quisiera poder la imagen cargando en el reproductor de videos de YouTube??.Si podrias responder te lo agradeceria.Muchas Gracias.

KnxDT  

Hola Jmiur, el código andaba bien con la imagen de blogger hasta hace algunos días pero ahora al dar clic no activa el script sino que invita a la descarga (como las demás imágenes subidas a Blogger desde hace algun tiempito).

Otra observación (off-topic): Ya tengo mi dominio :) una entrevista a tu persona en lo sucesivo. Saludos.

JMiur  

lacrax:
Aparentemente, esa imagen está pero se oculta en cuanto logra conectarse a youtube (eso imagino) y entonces se queda en blanco. No tengo idea de como hacer que continúe visible.

KnxDT:
Aunque se haya arreglado el problema, todas las imágenes alojadas en s1600-R siguen allí, inaccesibles, habría que cambiarles el directorio para que vuelva a funcionar.

Mr. Prado  

¡Muy buenas JMiur!

Espero que estés pasando unas estupendas fiestas.

Dicho esto, al grano. Me gustaría mostrar con este script este swf de aquí pero no me da los resultados esperados. ¿Podrías decirme cual es el código exacto que tengo que escribir para enlazarlo y que aparezca "dinámicamente" en su correspondiente "Caja" dentro de mi blog?

En el enlaze que te doy aparece el código para incrustarlo pero no es eso lo que pretendo.

¡Muchísimas gracias y que tengas una buena salida de año!

Mr. Prado  

"Enlace" con "c" en que estaría yo pensando ... :$

JMiur  

Aparentemente, el SWF no funciona si no está incrustado en la página pero, podemos hacerlo igual, colocarlo como no visible y abrirlo con LightWindow.

<a href="#SMS" class="lightwindow"
params="
lightwindow_width=298,
lightwindow_height=543,
lightwindow_loading_animation=true"
title=""
rel="">CLICK</a>

Todo eso escrito en la misma línea. Y debajo:

<div id="SMS" style="display:none">
<embed src='http://www.zedfreesms.com/es/swf/free_sms_lt.swf?language=es'
quality='high'
bgcolor='#ffffff'
width='298'
height='543'
name='free_sms_lt'
align='middle'
allowScriptAccess='sameDomain'
type='application/x-shockwave-flash'>
</embed>
</div>

También en una sola línea.

Usamos LightWindow como en cualquier otro caso pero, el atributo HREF no apunta al SWF sino a un DIV nuestro, en este caso, lo llamé SMS pero puede ser cualquier otro nombre: href="#SMS"

Y ese DIV se oculta y dentro de él, colocamos el código que nos dan:

<div id="SMS" style="display:none">
.... el codigo que nos dan
</div>

Aparentemente, funciona bien. Puedes ver una demostración ACÁ

Fíjate si eso te resulta útil.

Mr. Prado  

Tengo un problema no con el código que me das sino con el LightWindow.

No se lo que pasa pero no me hace lo que tiene que hacer sino que actúa como un simple enlace y no me abre la ventanita en la misma página. No es que me pase con ese código sino con cualquiera, no había intentado probar este truco hasta ahora.

Tengo implementado el código en la plantilla así que no se que puede estar fallando.

En fín, mañana seguiré.

Merci beaucoup.

JMiur  

El problema puede ser debido a que usas dos framekors: PROTOTYPE Y MOOTOOLS que, al parecer no son compatibles. Podrías deshabilitar la carga de mootools temporalmente y verificar si es así.

Mr. Prado  

Al fín lo he conseguido.

Muchas gracias.

De todos modos su pudieras me gustaría que le echaras un vistazo a mi blog y vieras dos "extraños" fenómenos que se suceden (el enlace está a la derecha, una imagen con el fondo amarillo):

- 1. No se lleva muy bien con el contador (aunque el contador durará poco). ¿Hay alguna forma de que no se "molesten" el uno con el otro?

- 2. Se abre en su correspondiente ventana pero se muestran también las barras de desplazamiento horizontal y vertical. Eso no pasaba en el ejemplo de tu blog de pruebas y tampoco me sucede en el mío si pongo el navegador a pantalla completa. ¿Formas de evitarlo?

¡Feliz salida de año JMiur!

JMiur  

Hay algo en el código que veo y que no comprendo ¿La imagen que sirve de enlace está dentro de un etiqueta <blockquote> ? Por lo menos, eso es lo que sale y puede explicar lo de los barras porque se agregan márgenes extras.

El código a usar sería algo así:

<a href="#SMS" class="lightwindow"
params="lightwindow_width=298,lightwindow_height=543,lightwindow_loading_animation=true"
title="">
<img
src="http://i208.photobucket.com/albums/bb255/logosfp/smspeq.jpg"/>
</a>
<div id="SMS" style="display:none">
<embed
src='http://www.zedfreesms.com/es/swf/free_sms_lt.swf?language=es'
quality='high' bgcolor='#ffffff' width='298' height='543'
name='free_sms_lt' align='middle'
allowScriptAccess='sameDomain'
type='application/x-shockwave-flash'>
</embed>
</div>

Lo he vuelto a colocar en mi blog de pruebas AQUI.

Lo de las incompatibilidades entre scripts es inevitable. Difícilmente pueda resolverse sobre todo con cosas tan complejas como estas.

Feliz Año, Mr Prado y, si el código no se ve bien, me dices y te lo envio por mail.

Mr. Prado  

Lo de """blockquote""" era la manera más rápida (y cutre) que se me ocurrió para centrar la imagen en la sidebar :$

Pero ya la he sustituido por:

""" div style="text-align: center;" """

... el código

"""/div"""
(no puedo poner los signos de mayor menor, pero se que te los imaginas)


Aún así me parece que sigue haciendo lo mismo, así que me imagino que ese tampoco será el código más apropiado para centrar nada :(

Si es que claro, con un chapuzas como yo y encima me cambias el tutorial de html por una jovenzuela rubia.. ¡¿qué hago yo?!

Mil gracias de todas las maneras.

Te hago trabajar hasta los últimos segundos del año.. :D

JMiur  

Bien, esto ya se ha convertido en un desafío personal :D

Creo haber encontrado el problema y es tan absurdo que parece mentira.

En el blog de pruebas, he logrado reproducir el error. Allí, ves dos SMS, arriba el que se ve mal y abajo, el que se ve bien.

¿Cuál es la diferencia? que en el código hay caracteres espacio y por eso, aparecen las barras.

params="lightwindow_width=298,
lightwindow_height=543,
lightwindow_loading_animation=true"

Elimina todos los espacios en lo atributos, es decir, todo lo que está entre comillas. Además, todos los espacios amtes y despues de < y >

¿Por qué ocurre esto? NI IDEA :D

Ah, y fijate que el primer div esté bien cerrado:

<div style="text-align: center;">
<a href="#SMS" class="lightwindow" ......... >
<img src= ......../>
</a>
</div>

<div style="display: none;" id="SMS">
<embed ............ />
</embed>
</div>

Mr. Prado  

Ensayo/error que se llama.

Bravísimo.

Mil gracias, ahora a disfrutar.

Premio a la constancia para vos. Me quito el sombrero.

Gracias.

JMiur  

No lo llamaría constancia, yo diría que sólo es ser cabezadura :D

Victor Manuel Agudelo  

a me me parece estupendo aunque lastima que use prototype, ya que es una libreria demasiado pesada, yo prefiero mootols.

y en este caso no se pueden usar las 2 en la misma pagina por que se chocan :(

JMiur  

Así es Vicman, son incompatibles. En mi caso, terminé eligiendo Prototype porque Mootools me traía problemas en Blogger pero, más que nada, porque este script me resultó muy útil.

Si hubiera algo similar en Mootools le daría otra oportunidad porque, como dices, es una librería mucho más liviana.

Anónimo  

Hola gente.

Estoy creando mi nuevo portafolio (soy diseñador y no programador), y tengo un problemilla con lightwindow. El problema es que cuando empiezo a desplegar trabajos, la opacidad oscura de lightwindow se me pierde. Lo mejor es que lo veais vosotros mismos.

Anónimo  

Hola, yo también soy diseñador y mis conocimientos en programación no llegan a lo siguiente:

En primer lugar, no se por que, tengo un flash con xml que en local me carga, en una web me abre bien, pero en el lightwindow no me carga los contenidos.

En segundo, y es lo que mas me preocupa, mi portfolio es horizontal, de izquierda a derecha, y lightwindow se corta en donde termina la página, de modo que si yo hago scroll a la derecha, deja de verse la capa negra.

No se como solucionar esto, habia pensado en quitar las barras de scroll cuando aparezca el lightwindow pero na, no lo consigo.

Una ayudita???

Fábio Neves  

Olá não escrevo em espanhol meu nome é Fábio e gostei da idéia e irei colocar em meu blog, já testei e tá beleza. Rapaz só não estou conseguindo mudar o nome da janela de "Cerrar e cargando" para "fechar e carregando" onde que mudo isso.

Desde já obrigado.

JMiur  

FNS FOE:

Para eso, debes editar el archivo lightwindow.js. Usa el block de notas, busca los textos a cambiar, cámbialos y vuelve a guardar el archivo.

Fábio Neves  

Olá JMiur, valeu de novo, cara o seu blog é muito bom, um dos melhores que já vi, tanto no Brasil quanto lá fora, digo melhor EUA. Aqui quem domina são as meninas, bom, deixa a rede mais florida, mas em relação a dicas o seu é mais completo. Parabéns mesmo.

Cara estou com uma dúvida, o arquivo "scriptaculous.js" tem que ser hospedado sozinho, entendi isso, e o effects, coloco ele onde?

Mais uma vez grato, e mais uma vez desculpa por não escrever em espanhol.

JMiur  

Mientras nos entendamos, el idioma no importa :D

Los archivos scriptaculous.js y effects.js deben ser alojados en el mismo servidor.

Necesitas tener los cinco archivos alojados en alguna parte:

prototype.js
scriptaculous.js
effects.js
lightwindow.js
lightwindow.css

Anónimo  

Rapaz, tá funcionado, só tem um problema que não é de todo ruim: Os scripts entre as tags "head/head" da função Lightwindow, fizeram a "folha de edição do blogger" ficar suspensa e sem poder mexer, mas dá para postar e também mexer na configuração e H TML, quando tiro os scripts dá pra mexer na "folha de edição", estranho isso, você já viu coisa igual, sabe solucionar. É um preço.

JMiur  

FNS:

Vas a tener que intentar explicarme un poco mejor el problema porque esta vez no comprendo de que se trata. Hablas de un comportamiento extraño del script en la hoja de edición HTML pero no alcanzo a entender que es lo que te ocurre.

Anónimo  

Jmiur, blz, vamos lá, a folha de html tá editando

http://img144.imageshack.us/img144/8650/folhadeedicaoab1.png

Já a folha que mostra o que foi criado não, fica suspensa, quando tido os códigos, fica normal, usei os seus, de seu link e dá no mesmo.

http://img255.imageshack.us/img255/6498/folhadeedicao2fv4.png

Tem idéia do que pode ser, o blog aparentemente tá funcionando.

Visita ele

h ttp://mundoreligare.blogspot.com

JMiur  

¿Puede ser que, por error, hayas eliminado algo similar a esto?

/** Page structure tweaks for layout editor wireframe */
body#layout #header {
margin-left: 0px;
margin-right: 0px;
}

Esas son las propiedades que controlan la forma en que se ve la plantilla en Elementos de la Pagina.

Fábio Neves  

Rapaz, blz, gostei do tutorial de HTML, bom mesmo. Jmiur, não é o código que vc passou não, aparentemente não, só tirando o códico do Lightwindow que dá para editar a folha de widget do blogger, se não, só o resto funciona.

Aqui está o código CSS do blogger, é pequeno, se puder dá uma olhada.

http://mundoreligarecodigos.googlepages.com/mundoreligarecss.txt

Conversei com outra pessoa e não viu problema no css do blogger, estranho.

Anónimo  

Hola, genial este truco, pero me puedes decir como hacerlo para los videos de youtube? Gracias

Syl  

Hola! he usado lo de la galeria de imagenes con solo un enlace, pero debajo del enlace, una vez publicada la entrada, me queda un espacio vacío como si estuvieran ocultos el resto de los enlaces de las demas fotos... No se si me explico bien :(
¿Es normal?¿Le puedes echar un ojillo a ver que te parece? Gracias de antemano!!

JMiur  

Sly:

Eso pasa en los posts. Deberías escribir toda la galería en una sola línea.

ASÍ NO:

<a ... >ENLACE</a>
<a ... style="display:none;"></a>

SINO ASÍ:

<a ... >ENLACE</a><a ... style="display:none;"></a>

¿Se comprende?

Syl  

Ayyy ya entiendo... es que estas pequeñeces se me escapan...GRACIAS!

JMiur  

Jajaja es que es una de esas cosas un poco insólitas de Blogger. Lo mismo ocurrirá con cualquier código que ingreses, parece no entender la diferencia entre un texto y un código HTML.

Anónimo  

HOLA! HE LOGRADO PONER EL EFECTO EN MI PAGINA PARA LAS IMAGENES, PERO NO SE COMO HACERLO PARA INSERTAR LOS VIDEOS DE YOUTUBE Y QUE AL PICAR ENCIMA SURJA EL EFECTO.
GRACIAS DE ANTEMANO TIENES UNA GRAN PAGINA.

JMiur  

Los videos de YouTube se ponen de manera similar pero, indicando el ancho y el alto, que es fijo:

<a class="lightwindow" href="XXX"
params="lightwindow_width=425,
lightwindow_height=350,
lightwindow_loading_animation=true" title=""
rel=""gt;
ENLACE
</a>

donde la dirección XXX es de este tipo:

http://www.youtube.com/v/jEOkxRLzBf0

Lo único que varía es eso en negrita, el ID del video.

Por supuesto, todo en una sola línea.

Anónimo  

Hola de nuevo!
He probado el codigo que me has facilitado y lo he probado en una entrada y me da error: Su HTML no es aceptable: Tag is broken incluso ignorando el error y siguiendo adelante con la publicacion de la entrada no aparece nada en la entrada, sale completamente vacia, el codigo lo he probado varias veces por si se trataba de un error mio pero estoy eguro de haberlo hecho bien a ver si me puedes dar una mano, el efecto tambien lo tengo puesto para los comentarios y no tengo problema solo lo tengo para los videos. De nuevo gracias y un saludo.

JMiur  

Ahí en el comentario, el único error es el final. Dice:

rel=""gt;

debe decir:

rel="">

Un TAG BORKEN es una etiqueta mal cerrada, supongo que ese es el problema.

B-Pirata  

Algo raro me pasa con lightwindows...

no me quiere cargar la imagen de fondo (creo que es la black-70..) cuando se abre la ventana.

Por ejemplo, si visito este sitio o el de la web oficial y veo algunos ejemplos en "firefox" luego si me aparece "oscuro el fondo", pero en ie no.
Lo mismo, si veo ejemplos de otras webs con ie,y luego la mia "se arregla" pero no en firefox.
Sin embargo, si abro las ventanas en lightwindows sin haber visto otras webs (con lightwindows) no carga la imagen de fondo...

He intentado de todo, pero nada, he cambiado el css, y ahora lo tengo implementado, tal como en este blog, sin embargo sigue pasando... creo que es la plantilla, pero no se porque pasa...

¿A que se deberá?

¿Nose si me explico bn?

Mira, pueden probarlo con la imagen de firefox que esta en mi sidebar (izquierda)

salu2

JMiur  

Raro, muy raro.

¿Podría ser que el problema lo cause el hecho que esas imágenes estén en Blogger? ¿Por qué no pruebas alojarlas en otro servidor?

Se usan dos:
black.png
black-70.png

B-Pirata  

SI lo he probado con las imagenes alojadas en imageshack y blogger, y sucede igual...

Pero lo que me parace más extraño que despues de ver ventanas en lightwindow en otros blogs funciona perfecto como si no pasara nada (en el mismo navegador)...

JMiur  

Eso es lo extraño porque no he visto que se produjera ese inconveniente al abrir tu blog ?Te ocurre con cualquier navegador? ¿Y en otra PC?

No veo errores en tu código.

B-Pirata  

osea yo lo he probado con iexplorer y firefox en distintas pc, incluyendo las del ciber... También lo he probado desde xp y ubuntu y lo mismo...

JMiur  

Me parece que en el script, estás utilizando las imágenes que yo alojé en mi blog y Blogger te impide acceder a ellas:

black.png
black70.png

Cuando se cargan fuera de tu blog, quedan en la caché y entonces el navegador las usa.

El primer paso, sería cambiarlas para ver si eso soluciona el problema y para estar seguros de cuñas es la imagen real que se ve.

B-Pirata  

No, compañero... las imágenes las tengo alojadas nuevamente, no son las mismas.

Lo que si hize fue copiar tu archivo css, alojando nuevamente las imagenes, para ver si asi se arreglaba, pero no T-T

Pero, por si acaso, voy a alojarlas de nuevo en otro lado (no en blogger) para ver si funciona ahora... y ahí te cuento...

salu2 y gracias

B-Pirata  

ouch!!

Creo que he captado...

me acabo de dar cuenta que en el archivo lightwindow.js también aparecía la url de las imagenes black y black-70... yo solo pensé que aparecía en el .css, por lo que las había cambiado de allí solamente... ouch!

¿a eso te referías, verdad?

Porque, al parecer ahora funciona bien...

Muchas gracias!

JMiur  

Si, disculpa. A esos archivos me refería, a los dos que están en el el script. Me parece que todo el problema radica allí.

Pedro  

Esta ha sido la solución para los videos de youtube en mi blog. Pero... hay un detalle y por esta razón todavía no lo he incluido en mi blog sino en el de prueba. Me gustaría cambiar la fuente de este texto (http://img36.picoodle.com/img/img36/4/3/21/f_yt2m_d20cdf6.jpg), el texto está marcado en la imagen. Me di cuenta que la fuente que usa en mi blog es Times New Roman y en tu blog es otra fuente. ¿Cómo puedo hacer para cambiar esta fuente a Tahoma o a cualquier otra? Salu2.
JuanCarlos 3941

Pedro  

Aquí está la dirección de mi blog de prueba para que veas también lo que quiero explicar... http://juancarlos3941b.blogspot.com

JuanCarlos 3941

la_miga  

Buenas! Vengo del blog de gema y esta aplicación me parece genial. Pero algo debo de estar haciendo muy mal porque usando vuestras directrices al intentar hacer un link con videos de "dalealplay" me hace una iframe, es decir que veo la página web directamente donde está el vídeo, no el video en sí como el vuestro de google.

¿Alguna idea?

Gracias por adelantado!

JMiur  

El problema, cuando eso pasa, es la dirección del video que se utiliza. Probablemente, colocando esa dirección en el navegador, pase lo mismo, no se abra el video sino una página.

En el menú del video de Dalealplay click en Incrustra video en tu pagina web
CODIGO HTML:

La dirección es todo lo que necesitas y dice algo así:

http://www.dalealplay.com/dalealplay.swf?
file=38347/Maldivas.flv

Puse un ejemplo en mi blog de pruebas

Revisa eso y si no, envíame el código que utilizas por mail y lo reviso.

la_miga  

Vale! Esa parte solucionado;) En cuanto mandé el mensaje me di cuenta y utilicé el otro enlace, pero ahora el problema es que Firefox no me va :( Si con IExplorer, pero con firefox se carga la imagen pero después no puedes hacer funcionar el vídeo. He visto con mucha gente ha tenido el mismo problema y miré la web original y dicen que está solucionado, pero a mí no me va. ¿Alguna otra idea?

JMiur  

En eso ya no hay mucho que pueda hacer, el reproductor depende del servicio.

Anónimo  

Ahoraaaaaaaaaaaaaaaaaaaaaaa
puedo dejarte el agradecimiento infinto que te merecés!!!!!!!!

Thenkiussssssssssssssssss

(Costó eh?)

;-)

Un beso Sr!

JMiur  

Mar:
El único mérito es el de tu perseverancia :)

YoTMBsoyPiojoso  

Hola Soy Mini de Argentina Buenos Aires

Me encanto justo era esto lo que necesitaba, Muy buenas Tus explicaciones y sobre todo la ayuda que brindas a todos los que recien empezamos.-

Voy a probarlo Mañana ...y te digo como me fue

Desde ya agradecido por la Informacion....

Cualquier inconviente espero poder contar con tu ayuda tambien.-

Saludos Mini Un Inmenzo abrazo!

JMiur  

Saludos Mini. Espero que tengas suerte y, desde ya, cualquier ayuda que necesites, aquí estaré :)

Nicar  

Lo primero de todo gracias por la ayuda.Me está ayudando muchísimo en la construcción de mi blog.
Sobre Lightwindow yo quitaría lo de casi,casi perfecto.ES UNA PASADA.
Lo agregé y me funciona estupendamente con jpg.Eso de que la pantalla se ponga oscura me pone.
Mas adelante probare con otros archivos.
Una consulta que te hago.En diseño/añadir y organizar elementos la pantalla queda cortada.Lo soluciono quitando de la plantilla el codigo que pongo antes de /head.Es un coñazo pero no quiero perder el Lightwindow.¿se podrá hacer de otra forma?.
Mil Gracias.Este es el primer post? de mi vida

JMiur  

Jajaja, dejo el CASI por las dudas no aparezca algo mejor, nunca se sabe :D

Con imágenes no hay problemas, funcionan todo los formatos que pueden subirse en Blogger.

Lo otro, trataré de adivinar, ¿era algo así?:

/* BLOGGER: page structure tweaks for layout editor wireframe */
body#layout #header {margin-left: 0px;margin-right: 0px;}

Si es eso, se trata de las propiedades que controlan la página Agrega y editar Elementos. En nada afectan al blog en si mismo.

Es algo muy difícil de controlar. Algo de eso está explicado acá y lo único que puede hacerse es proobar diferentes combinaciones a ver cuál funciona mejor.

Nicar  

Gracias. Voy a intentarlo.

Anónimo  

Hola, JMiur gracias por el aporte esto, en verdad, es realmente genial estoy aplicandolo a mi blog pero tengo un "pequeño" problemilla sucede de que ya inserte en la planilla sus respectivos url de los CSS y los JS y lo guardé!, ahora el problema es que no se donde poner o agregar «la clase lightwindow»... en la misma planilla?? o en otra etiqueta de HTML (pero en el mismo blogger)???... EN QUE LADO PRECISAMENTE..
le agradeceré enormemente su respuesta
Hasta pronto

JMiur  

Por un lado tienes subidos los archivos. Luego, los cargas en la plantilla; creo entender que eso ya lo has hecho.

Ahora. Usarla es sencillo; la case lightwindow, la agregas a cualquier enlace en donde quieras; en un elemento o en un post. Cada vez que quieras que algo se abra en ese tipo de ventanas, colocas class="lightwindow" en la etiqueta A. Por ejemplo:

<a class="lightwindow" href="unaImagen">ENLACE</a>

Allí si en href colocas la direccion de una imagen, al hacer click en el ENLACE se abre la ventana modal.

¿Esto aclara un poco las cosas?

Nicar  

Hola JMiur. El problema que tenía en Añadir y organizar elementos de la pagina lo solucioné por casualidad.
Voy a intentar recopilar.Al incluir los archivos de LightWindow en edición html la pagina de Editar Diseño nunca termina de cargar.Si pincho en Borrar Cambios aparecen todos los elementos del sidebar pero no los puedo arrastrar,con el ratón para organizar. La sorpresa es que editando con IE la pagina carga normalmente y puedo arrastrar los elementos sin ningún problema. Espero que esto le pueda servir a alguien.

JMiur  

La página de Editar Diseño de Blogger funciona mal hace rato y, al parecer hay muchas razones. En el caso de no terminar de cargar puede detenerse con el botón STOP del navegador.

Miguel AS  

Me parece muy buena, todo en uno, solo que pregunto como se pudiera ocultar flash cuando se llama la ventana modal.

JMiur  

Miguel Angel : Me tendrías que explicar un poco la idea porque no termino de entender a que te refieres con ocultar Flash.

Miguel AS  

Gracias por contestarme. el problema es que en nuestro sitio tenemos tres banner hechos en flash y al llamar la ventana modal estos baner se superponen al fondo de la ventana.

JMiur  

Comprendo el problema. Tendría que ver el sitio para dar una respuesta y ver si tiene alguna solución.

En teoría, podría verse la propiedad z-index de esos elementos. Estoy pensando en voz alta :)

MarvinG  

Hola Jmiur!
Agradecerte por las ayudas que das, y ahora es cuando necesito una ayudita :)
Segui todos los pasos al pie de la letra, ya subi los archivos, agregue los archivos a la planilla, ahora le doy click a una imagen que le puse para que aparesca con el lightwindows y no me sale nada, como q se atascara, y tengo q presionar la tecla escape para salir de ahi, eso me pasa en firefox, en IE le doy clic al enlace de la foto q deberia aparecer con ligthwindows y me sale el cuandro donde pareciera q fuera a aparecer la imagen pero sale un cudrito chikito sin la imagen y sale un cudrito chikito con una X roja como si no existiera la imagen :(
No se que pueda ser, quisiera q me ayudes en eso porfavor, esperare tu respuesta.

PD: El codigo que estoy usando es el que pusiste en un comentario:
<a class="lightwindow" href="unaImagen">ENLACE</a>

MarvinG  

Jmiur disculpa pero ya me sale, ahora lo que no entiendo es porque no me sale con las imagenes que subo a blogger, tiene algun problema con las imagenes que subo a blogger?, porq con esas imagenes no me sale nada :(
Que puedo hacer al respecto?

JMiur  

No debería haber problemas pero, depende mucho de la dirección que estás usando. A ver si este post ayuda a entender el tema.

Si no es así, muéstrame exactamente cuál no funciona. El código de Blogger es realmente molesto.

MarvinG  

JMiur con el tutorial de las imagenes que me has dado me sirvio, si ps era ese el problema de la carpeta donde se aloja la imagen de blogger :D, muchas gracias :D
Eres un maestro.

JMiur  

Me alegro que sirviera, no sabía exactamente cual era el problema pero me imaginé que venía por ese lado. Blogger escribe códigos "raros" para las imágenes y llega a confundir a cualquiera.

Alvaro Galindo Vácha  

Hola JMIUR, De antemano gracias por este sitio tan bueno...tengo un problema, monte el LightWindow en un sitio joomla y funciona perfecto con firefox, pero cuando trato de verlo en IE6 la ventana se desliza por el costado izquierdo y no la puedo ver,...me podrias dar una mano...?

Muchas gracias...

JMiur  

Es un poco difícil saberlo sin ver la página pero, en principio, debería funcionar sin problemas en IE. Ahí, el tema podría ser la definición del DOCTYPE que debe ser STRICT o TRANSITIONAL y para IE, esa declaración, debe ser la primera de la página; ni siquiera debe haber un comentario antes.

Alvaro Galindo Vácha  

Muchas gracias por el interes, te pongo el sitio por si tienes un momento para verlo:

http://equalplus.net/newsite2008/index.php?option=com_content&task=view&id=44&Itemid=205

y el enlace es: » Benoit Marquet

Muchas gracias otra vez, me ayudarias mucho JMiur

cordialmente,

Alvaro

Anónimo  

Hola, Jmiur.

De nuevo por aquí para hacerte una pregunta muy sencilla.

Como recordarás, en mi blog adopté LightWindow únicamente para abrir una ventana modal en los comentarios. Actualmente cargo los siguientes ficheros:

* prototype.js
* scriptaculous.js
* lightwindow.js
* lightwindow.css

Estaba intentando aligerar la carga de la página, para lo que he eliminado los dos primeros, pero de inmediato la ventana modal deja de funcionar. Si los repongo, todo vuelve a su ser.

Según he leido en la entrada sólo los dos últimos son los necesarios. ¿A qué se puede achacar el error?

Como siempre, gracias y saludos,

Max & Birrax.

JMiur  

No, Max. Todos los archivos son necesarios, Lightwindow usa los otros dos y sin ellos, no funcionará.

Anónimo  

Era lo que me temía...

¡Muchas gracias!

Sandromex  

Hola a todos,
Tengo un problema con ese script una vez que esta todo instalado...todo me funciona bien se abre la foto y todo super, pero si entro para agregar un elemento al blog no se carga la pagina, o mejor se carga a la mitad y ya no avanza...que hago? Quitando el codigo :

script src='http://www.megustacancun.com/0light/prototype.js' type='text/javascript'/>
script src='http://www.megustacancun.com/0light/scriptaculous.js?load=effects' type='text/javascript'/>
script src='http://www.megustacancun.com/0light/lightwindow.js' type='text/javascript'/>
link href='http://www.megustacancun.com/0light/lightwindow.css' media='screen' rel='stylesheet' type='text/css'/>

ya me carga la pagina asi que es seguro que el problema es del codigo.

Alguien me ayuda?

JMiur  

El código se ve correcto.

De un tiempo a esta parte, la página Agregar Elementos de Blogger funciona mal; parece que cualquier cambio que uno hace que se sale del esquema clásico de las plantillas, la perturba.

Personalmente, eso es algo que me viene pasando aún sin ese script. No sé si será el mismo problema que tienes, se carga y parece no terminar nunca.

Basta hacer click en el botón STOP del navegador para que pueda usarse normalmente.

Sandromex  

En http://calciomercatonapoli.blogspot.com

Ale  

Muchas gracias por toda la información, me estoy leyendo enterito tu blog, gracias!

JMiur  

Gracias por el comentario, Ale, me alegra que te fuera útil :)

Unknown  

hola,quisiara hacerte una consulta.
ya tengo todo lo de lightwindow instalado en mi blog y funcina perfectamente,pero no se por que, no me deja implementarlo en la barra de navegacion, que es una lista horizontal, alguna sugerencia? mi blog es http://biblioteca-alejandrina.blogspot.com

saludos

JMiur  

¿Qué significa que no funciona?¿Te muestra un error o si se coloca no se abre la ventana?

En teoría, debería funcionar como cualquier enlace:
<a class="lightwindow"
href="http://xxxxx"
params="lightwindow_width=ANCHO,lightwindow_height=ALTO"
title="" rel="">Texto del enlace</a>

¿Podrías colocar el código aunque no funcionara para verlo online?

Unknown  

al poner el codigo me da error.yo antes ponia el codigo al class="lightwindow" al final del enlace

asi
<li><a class='window' href='http://biblioteca-alejandrina.blogspot.com/2001/04/contacto.html'class="lightwindow">contacto</a></li>

intentare ponerlo al principio como dices

Unknown  

uf, no sale entero el codigo y ademas
parece que estan caidas las googlepages

Unknown  

ya lo arregle, como decia antes de que se calleran las pages, yo poima el codigo class al final y no me lo admitia, lo puse entre a y href y funcina de maravilla como se puede ver ,
muchas gracias

JMiur  

Sí, Google Pages parece estar con problemas.

Aunque hayas logrado solucionarlo, te muestro lo que veo. No es un problema en el orden de los parámetros, eso, no influye en ninguna etiqueta, da lo mismo ponerlos al principio o al final.

class='window' eso era un error porque es
class='lightwindow'

El otro era que no había un espacio entre los parámetros y de allí el error que te mostraba Blogger:

... contacto.html'class="lightwindow" ...

debería ser:

... contacto.html' class="lightwindow" ...

Sea como sea, veo que funciona así que mis explicaciones están de más :D

Unknown  

pucha,siento molestar de nuevo,pero ahora no me deja poner lo parametros
me dice
Mensaje de error de XML: Element type "a" must be followed by either attribute specifications, ">" or "/>".

tambien e observado que a veces hay que poner class="lightwindow" y otras
class="lightwindow" ¿como saber como poner una u otra
saludos

Unknown  

mea culpa, mea culpa ,por no fijarme en los espacios.

ya lo arregle

gracias de nuevo

JMiur  

Me alegro que se haya arreglado :)

Anónimo  

Edwar soy ANA la hermana de Jimmy no se si me recuerdas he perdido tu telefono. pasate por el blog de mi hermano. Un saludo

Anónimo  

CARAJO!! Que excelente aporte el mejor del año !!!

Descargando los archivos modificados gracias ;P

Anónimo  

Oye no me sirve, y he notado que no pones en la lista antes de /head, no estás incluyendo el effects.js

¿Qué estoy haciendo mal tengo que incluir el effects.js?

JMiur  

El archivo effects-js lo carga el mismo scriptaculous; por eso dice:

src="URL_scriptaculous.js?load=effects"

Viktor Lecter  

Amigo JMiur en este post creo te falta poner el link a effects.js yo se que explicas que algunos ya tienen ese tipo de archivos por otros programas pero quiza la gente se confunda, yo al menos si me confundí al principio.
Donde dices:

Una vez que tenemos alojados los archivos, los incluimos en la plantilla, por ejemplo, justo antes de:

Luego pones los links, pero falta este:

URL_effects.js

estuve como tarantantan ja ja ja una hora viendo que pasaba ya que el hack es efectivo, como anecdota te cuento que en la plantilla de mi pagina principal no lo necesité pero al querer instalar el hack en otras se me hizo imposible sin este js. hasta que lo subi y lo referencié.

Saludos...

Victor.

JMiur  

Tal como ice el post, hay que alojar TODOS los archivos, incluyendo effects.js pero, para este último, al igual que para cualquiera de los módulos de scriptaculous, no es necesario usar un link especial, basta, tal como dice la explicación, cargarlos juntos. Por eso, la instrucción es:

<script type="text/javascript"
src="URL_scriptaculous.js?load=effects">
</script>

Unknown  

Hola, tengo dudas con respecto al tema,

para utilizar solo el efecto de las imaganes debo subir los 4 archivos?
en mi post o tema si quiere darle efecto a una imagen con lightwindow como debo postear la imagen xD. (codigo html)
a que te refieres con "ENLACE" u.u.

Gracias =).

JMiur  

Sí, aunque quieras usarlo sólo para imágenes, debes subir todos los archivos. Hay otro script que hace algo similar pero es más pequeño; para imágenes funciona bien. Aqui hay una explicación de ese script.

Para simplificar, un enlace es un texto o una imagen sobre la que haces click y "ocurre" algo. Normalmente, abres una página web pero también se pueden ejecutar otras cosas. En este caso, se abre una ventana especial.

Por ejemplo, lo usarías así:

<a class="lightwindow" href="laImagen.jpg">
CLICK
</a>

Unknown  

Hola, gracias por el truco, ya me salio xD, solo tengo una curiosidad, ahmm se puede manejar el tamaño de la imagen pop up(por asi llamarlo) que se abre, o solito se adapta a la imagen?

Gracias =).

JMiur  

En principio, no es necesario colocar el tamaño de la imagen ya que el script lo detecta automáticamente pero ... en Internet Explorer puede ser necesario colocarlo. De todas formas, es sencillo:

<a class="lightwindow"
href="laIMAGEN"
params="lightwindow_width=ANCHO,lightwindow_height=ALTO"
title="" rel="">

El Diablo Des.  

¿Cúando dices subir a un servidor propio, te refieres a que no puede ser en uno como file-uploader o algo parecido? Me refiero a la parte en la que hay que subir los archivos, porque he intentado y sigo sin poder ver la "light window".

JMiur  

Lo que debes usar es un servidor que te permita acceder directamente a los archivos. Muchos, no lo permiten, no te dan un enlace directo: Google Pages y Hostfile, por ejemplo.

Anónimo  

Lo estuve mirando al script y todavía no decido implementarlo, primero porque parece ser pesado y mi blog tiene muchas imágenes y segundo porque todavía no soy muy hábil con los códigos. Pero lo voy a tener en cuenta para más adelante.
Gracias nuevamente

Anónimo  

Algo debo de estar haciendo mal, por que el efecto no funciona, solo lo transporta a una página anexa.

Seguí los pasos, pero no sé.


Saludos.

JMiur  

Nav's:
debería verlo online para decirte donde está el error. Si tienes algún ejemplo, dime donde puedo verlo.

Anónimo  

el efecto debiera verse en una imagen que tengo entre los últimos comentarios y el blogroll


Saludos.

JMiur  

El tema es que están mal los enlaces de SkyDrive.

Por ejemplo, esta es la pagina y no el archivo:
http://cid-13da4691878b8796.skydrive.live.com/self.aspx/P%c3%bablico/lightwindow.css

Para saber la URL del archivo, haz click con el boton derecho sobre el icono del archivo y Copiar direccion del enlace. Será este:
http://hglogw.bay.livefilestore.com/y1pYnzXw7e-
KQATzWeronMPOo3ARHek89lSpiEghOndJlQ0aHNvB9E-
S8nrRiFI_vLh5VDuGbINpik/lightwindow.css?download

Elimina ese ?download y listo.

Anónimo  

No lo había pillado, ni siquiera me había dado cuenta, que torpe de mi parte.

Gracias Jmiur.


Saludos

Sergio Gil  

Hola !

el lightwindow me funciona muy bien con los videos de Google, pero en el caso de youtube, el efecto lightwindows funciona, pero el video aparece por un instante y luego queda la ventana en blanco...

Me podrias ayudar con el codigo a insertar para ver videos de youtube y luego yo le cambio la url del video ? Gracias anticipadas.

JMiur  

Sergio:

Lo más probable es que la URL del archivo de video sea incorecta. Fíjate que sea de este estilo:

http://www.youtube.com/v/jEOkxRLzBf0

No es exactamente igual que la àgina de YoTube, tiene una leve diferencia.

Sergio Gil  

Hola Jmuir

Gracias por tu sitio .. excelente !

El ligth window me funciona perfecto, pero no he logrado hacerlo con el CBOX, segun entiendo porque se trata de iframe.

Actualmente lo tengo funcionando con el efecto expandir y lo puedes ver en mi blog al hacer clic encima de una imagen al lado derecho que muestra una mano con un lapiz con el titulo "dejar un Mensaje"

Te agradeceria si tienes alguna idea o comentario al respecto.

Gracias de nuevo y saludos !

Sergio Gil
www.migranfamilia.org

JMiur  

Sergio:

¿Has probado algo así?

<a class="lightwindow" params="lightwindow_width=ANCHO,lightwindow_height=ALT" href="#cboxdiv">
ENLACE
</a>

Y ocultando el DIV del CBOX:

<div style="display:none;" align="center" id="cboxdiv">

Sergio Gil  

Hola Jmuir

Tengo como 40 videos que quiero mostrar en mi blog y en alguna parte he visto que cuando se trata de muchas imagenes, posts, o videos en mi caso, lo hacen mostrando algo asi como este ejemplo:

Ver Vídeos:

[1] [2] [3] [4] [5] [6] etc.

Los numeros pueden mostrar imagenes o titulos individuales al pasar el mouse por encima de cada uno de ellos.

y al pinchar sobre el numero, la imagen o titulo que te interesa este te lleva directamente al tema que quieres ver (vídeos en mi caso) sin salir de tu pagina.

Se puede lograr esto con el lightwindow ? por ejemplo con el codigo que ilustras como "galeria" ?

Me podrias ayudar con la estructura del código ?

Gracias anticipadas y saludos !

Sergio Gil
www.migranfamilia.org

JMiur  

Sí, eso puede hacerse con LightWindow ya sea en una galería o no, simplemente poniendo cada enlace:

Envíame un mail con las URLs de dos o tres de esos videos para que te muestre un ejemplo porque en este tipo de formulario, sería engorroso de escribir.

Sergio Gil  

Gracias Jmuir

Estos son tres de los videos que tengo alojados en Google video:

http://video.google.com/googleplayer.swf?docid=-7686347530935982454&hl=es&fs=true&autoplay=1"

http://video.google.com/googleplayer.swf?docid=5500759329282619649&hl=es&fs=true&autoplay=1

http://video.google.com/googleplayer.swf?docid=-5842824533760028161&hl=un&fs=true&autoplay=1

Gracias por tu colaboracion !

Saludos,

Sergio Gil
www.migranfamilia.org

JMiur  

Recibí tu mail, Segio. Intentaré contestarte por correo.

Anónimo  

Hola, estoy usando el lightWindow pero el problema es que la pagina que estoy usando contiene algunos banner flash y cuando se abre el ligthwindow, los flash siempre quedan al frente. como puedo solucionarlo?

JMiur  

Hay que revisar una propiedad que se encuentra en la hoja de estilo CSS de LightWindow llamada z-index y probar con valores más altos para que la ventana modal quede "encima" de todas las demás. No siempre es posible hacerlo.

JIM UTFSM  

Por acá podrías actualizar el tema de cargar scripts alojados en Google, así se hace mucho, pero mucho más fácil el tema de los scripts. Además, de poner en la entrada cómo manejar los videos de YouTube, puesto que está solo en los comentarios y se pierde un tanto. Pero es solo una recomendación.

Sobre problemas/issues no he podido cargar videos de YouTube con autor (author), es decir, puedo cargarlos solamente con título y descripción (title y caption). Aparentemente omite el author en este caso. Por qué? aún no lo se.

Otro detalle, es que no se pueden hacer galerías de video (media), según el autor sí, pero al menos con YouTube no he podido, aunque esto ya es más sofisticado...

Espero generarte más feedback en lo venidero, ya que veo que tienes una audiencia bastante grande, la idea es que la comunidad mejore :D
Felipe.
Saludos desde Chile.

Anónimo  

Hola, soy diseñador y esto de codigos no me anda muy bien todavia, estoy probando este lightwindow y en firefox y google chrome me funciona perfecto, pero al probarlo con iexplorer y opera me da un error y es el siguiente, cuando muevo mi pagina verticalmente este "popup" que se genera tambien se corre al igual el fondo negro y el otro error que si me aparece en todos llos navegadores es que al cambiar el tamaño del navegador, el pop up no se me ubica siempre al centro.

espero no sea muy complicado de arreglar. gracias

JMiur  

Lo de los scripts de Google está comentado en otras entradas, por ejemplo, acá. En principio, salvo casos muy especiales, los artículos no se actualizan.

Es cierto que al redimensionar el navegador con una ventana modal, esta no se vuelve a centrar. Su posición se establece antes y por lo tanto, es fija. También es cierto que al desplazarse verticalmente, la ventana se desplaza. Ambas son características propias de estos modelos y difícilmente puedan arreglarse porque han sido pensadas así. Hay otros scripts que poseen otras características como por ejemplo, mostrarlas fijas.

Unknown  

Saludos a todos. Acabo de instalar el LightWindow y esta genial Cabe resaltar que no se NADA de CCS. Solo aprendi usando.

Cuando pongo imágenes, el popup aparece con una barra negra de margen a la izquierda y a la derecha. Hay algún archivo que deba modificar para centra la imagen? Mirenlas ustedes mismos:

dieselartesvisuales.blogspot.com

Gracias!!

JMiur  

Franco:

El problema es que en tu plantilla, todas las imágenes están definidas para que tengan un borde:

img {
background:#1B1B1B none repeat scroll 0 0;
border:1px solid #1B1B1B;
padding:6px;
}

En principio, eso causará problemas varios; no es muy recomendable hacerlo porque TODAS las imágenes tendrán ese estilo y habrá que indicar cuales no.

Si quieres mantener eso, prueba agregando esto luego de cargar el CSS de LightWindow:

<style>
#lightwindow_contents img {background-color:transparent !important;
border:none !important;
padding:0 !important;
}
</style>

Anónimo  

JMiur! si yo quisiera usar el lightwindow solo para ver imágenes, como haría?, es decir para ahorrar cargar todo el codigo, porque veo que eso hace mucha carga a la pagina, y yo quisiera solo para ver imagenes con el lightwindow.
Estuve viendo tu codigo y veo que el lightwindow lo usas diferente, o al menos eso me parecio, podrias darme una idea?
Ya que yo solo lo uso para ver o ampliar imágenes.

Saludos...

JMiur  

En ese caso, deberías usar otro script como LightBox. Pero, si se trata de tiempos de carga, LightWindow no es el problema sino las librerías que necesita para funcionar: prototype.js + scriptaculous.js

Anónimo  

ummmm ok JMiur, y como hago ahi en ese caso con esas librerias para que la carga se mejore?

JMiur  

No hay mucho que puedas hacer, tal vez, comprimir los scripts.

Anónimo  

Bueno, no se si será eso de comprimir, pero por ejemplo ya voy viendo a varios que usan lightwindows, en donde el archivo prototype lo sacan algo asi como de google, es decir, ponen algo como google.load(...), y así, y luego el lightwindows lo meten en un Style, pero no se bien como hacer todo ese proceso, y creo yo que eso acelera mucho el proceso de carga, justo eso quisiera saber hacer, para aplicarlo :(
Espero me pueas ayudar.

Saludos...

PD: Tu blog ahora lo veo más rapido :P enseñame tus trucos :$

JMiur  

Lo del API de Google puede verlo acá.

Anónimo  

Gracias JMiur, ya acabo de terminar de hacer todo eso, y ya está :D, logre optimizar un poco más el mi blog :D, como siempre gracias a tus consejos, y chekeando y aprendiendo mirando tu codigo :D

Saludos...

Ing. Esau Zavaleta  

Buen truco esta padre felicidades por tu web

webmaster: Esau Zavaleta
http://www.notihuatulcopuertoescondido.com/

Unknown  

Hola Jmiur:
Como siempre siguiendo tu extraordinaria producción de novedades en todos los temas.-En videoteca tengo aplicado vagaTooltipsFlash.js tal como dices en como insertar videos sin insertar videos.-Mi pregunta es: si quiero aplicar Lightwindow, tengo que eliminar el otro o pueden funcionar juntos sin conflicto

JMiur  

Aviber:

No hay problemas con usar ambas alternativas; de hecho, es lo que hago yo en el blog así que no vás a tener problemas.

Jaime Martinez  

buenas,
TEngo una template con 2 iframe's y dentro de uno hago la llamada a lightwindow, pero necesito que salga a pantalla completa fuera de un iframe, como puedo hacerlo ??

JMiur  

Jaime:
Hasta donde sé, el contenido de un IFRAME no es manipulable.

Anónimo  

Hola, esta muy bueno tu tutorial y de hecho ya estoy utilizando lightwindow pero tengo la siguiente duda...

He intentado hacer que una vez que se carga la lightwindow no se cierre al hacer click en cualquier parte sino que en el boton cerrar o despues de una cierta cantidad de segundos .... existe esta opcion o es imposible de hacer ??

Enrique V.  

Hola JMiur yo tengo una duda... si nunca he usado efects dónde tendría que poner el archivo (o url) de efects.js para que este truco funcione? Gracias de antemano

JMiur  

XploiT:
Eso que quieres hacer n oexiste como opción en el script. Por lo menos, no hasta donde yo sé.

Enrique:
effects.js es cargado por scriptaculous. Por eso dice:

src="URL_scriptaculous.js?load=effects"

Tambien puede hacerse de manera separada:
src="URL_scriptaculous.js"
src="URL_effects.js"

Enrique V.  

Si.. a pesar de mi limitado conocimiento en html deduje que por eso decia load jej... solo que supuse que tenia que estar ese "effects" en algun lugar para cargarlo... y como nunca lo he usado... vamos mi confusion es que yo bajé el archivo effects.js en el paquete que amablemente proporcionaste y no se donde ponerlo o si sea necesario ponerlo en algun lugar jij perdon por la molestia .... y bueno acabé haciendolo a como mi cabeza me daba a entender y no me funciona muy bien... puse un video de youtube y me abre toda la pagina cuando hago click en el ENLACE

JMiur  

Claro, el script effects.js debes subirlo también. Ahí entonces viene el problema porque dependerá del servidor donde lo alojas.

Si luego de subirlo siguen los problemas, fíjate en este posta. Ahí se muestra cómo usar esos scripts sin necesidad de alohjarlos uno mismo, utilizando las APIs de Google. Es lo que estoy haciendo en este momento desde que GooglePages tuvo problemas.

Otra opción es comprimir los scripts, eso te permite tener sólo un archivo JS y no tres.

Alrevez  

Hola, tengo un problema con IE7, lo probé en firefox, Chrome y Safari, pero en explorer no funciona, la ruta es http://nextmedia3.imagine.com.co/pruebas/blaa/

No se si es algún problema con el doctype, espero puedan darme una luz con el tema!

gracias

JMiur  

Sí. Es probable que el problema sea el DOCTYPE del sitio. Una posibilidad es que sea de este tipo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Anónimo  

Hola, enhorabuena por tu trabajo.

He probado tu script para abrir un formulario, y funciona perfectamente en mozilla, pero al abrirlo en explorer hace el efecto contrario. En lugar de aparecer y maximizarse, aparece maximizado y desaparece.
Alguna idea??
Gracias

JMiur  

Debería verlo online. En IE lo único que necesitamos agregar siempre es el ancho y el alto de la venta a abrir ya que parece que no puede calcularlas antes.

Anónimo  

Efectívamente todo funciona correctamente excepto en IE6 y 7. Como bien dicen el centrado del pop up no puede calcularlo antes y pasa por editar el codigo enlace con los parametros que ya se han puesto. De esta forma evitamos que la secuancia dinámica de carga del script vaya a left y Top=0.
El otro problema es que al hacer la animación de estirarse la ventana a buscar su tamaño el IE lo hace al revés y reduce la ventana a 32X20 pixels más o menos. No sé si eso tiene que ver con el DOCTYPE ya que modificando dentro del css el código relativo al IE= padding y margin consigo agrandarla pero sin encontrar una logica clara...
He estado un buen rato modificando el css pero no he conseguido encontrar la llamada correspondiente al tamaño final del pop up.
Resultado: no se ve bien
Pongo un link al fallo para ver si puedes echarnos una mano:
http://www.katiemelua.es/index.php

JMiur  

Artzain:

En IE funcionará siempre que se establezcan los valores de las ventanas de manera explícita con params=lightwindow_width=valor,lightwindow_height=valor. Eso puede chequearse en este mismo post.

La otra condición es que el DOCTYPE sea correcta, incluyendo DTD:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

o bien:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Anónimo  

hola Jmiur
he probado el lightbox y el lightwindows para agrandar imagenes dentro de la web pero ahora me gustaria hacer algo como se ve en esta pagina www.silvio.cl (hecho en lightbox) que cuando alguien tipee la direccion se abra la web con una imagen superpuesta ...

gracias

JMiur  

Julita:

Esa página usa Lightbox y una de seis funciones internas. No he experimentado con ellas pero, el tipo de código que usa es este:

<body onload="LightboxDelegate('URL_imagen','texto');">

Anónimo  

Hola ojala puedan ayudarme chicos con mi problema :
tengo una pagina dividida en 2 , lado derecho los menús y lado izquierdo un iframe de color trasparente , el problema es que al pinchar las imágenes mostradas por el iframe solo aparece un rectángulo de color trasparente cargando las imagenes , este problema pasa con IE7 y no con Firefox ....

Ayuda plizzzzzzzzzzzzz

JMiur  

Prueba establecer el valor del ancho y el alto de las imágenes a ser mostradas, usando:

params=lightwindow_width=valor,lightwindow_height=valor

D@GU  

Hola gracias esto era lo que buscaba , pero tengo un problema :(( , el fondo al rededor de el contenedor que debe oscurecerse no cambia de color, muestra los colores originales de lo que hay detras y no deja ver el link para close ni el title, quisiera que me ayudaras por favor Jmiur gracias de antemano.:D

JMiur  

No veo en cual de tus blogs lo estás usando. Ese fondo es una imagen; lo más probable es que no sea accesible. Habría que verificar eso primero que nada.

D@GU  

Hola de nuevo Jmiur , no lo estoy utilizando en ninguno de mis blgos de blogger la uso en mi blog de wordpress mira aqui estoy ensallandolo en mi pagina de proyectos , http://zeronoblame.net84.net/blog/proyectos/ para ser mas exactos en el link de bleach es el que estoy probandolo.

Gracias nuevamente por tu atencion y amabilidad

D@GU  

Jmiur de alguna manera "milagrosa"(de verdad no hice nada :X ) ya funciona la opacidad mil gracais por todo esto me sera realmente util , pondre un banner de tu web en la mia para agradecerte todos los conocimientos que nos brindas a todos.

D@GU  

:O :(otra vez de manera milagrosa se volvio a dañar la opacidad , de erdad que no hice nada, o seria que mi subconsiente me mostraba lo que yo queria ver y ahora no domina mi realidad u.u
que mal :(( de todas maneras me gusta asi tambn pero es que todos tenian la opacidad :((

JMiur  

D@GU:
En Firefon no veo problemas. Siempre que abro la página, se muestra el fondo. En IE, en cambio sí. El problema puede ser la imagen:

http://bp3.blogger.com/_hljKDuw-cxQ/R0Sx-DB1Q7I/AAAAAAAADws/QckWX8qlK_A/s00/black-70.png

Tal vez, probando con otra alojada fuera de Blogger.

El resto es correcto.

Otra posibilidad a probar es si el tema es IE, colocar algo así luego del CSS de LightWindow:

<!--[if IE]>
<style>#lightwindow_overlay {background-color:#000}</style>
<![endif]-->

D@GU  

Gracias por todo finalmente se soluciono :D

Unknown  

Supongamos que ya aloje los archivos en mi servidor propio los que tu ya has modificado y los eh pegado los scripts antes de head puse el enlace y cuando le doy clic simplemente no pasa nada :( ¿que mas necesitó?

JMiur  

Puede ser cualquier cosa. Lo más común es que los archivos sean inaccesibles porque la URL es incorrecta.

Si me dices donde lo tienes aplicado, me fijo.

Yosh!  

hola, que hermoso queda! bien lo dices JMiur , "casi perfecto", mi duda es, ¿como cambio lo intenso de la opacidad del fondo? me gustaria que se obscureciera un poco más.

JMiur  

El color en realidad es una imagen de fondo. Fundamentalmente, está en esta definición:

#lightwindow_overlay {}

es la imagen black-70.png

Yosh!  

Gracias por la respuesta JMiur y tengo una duda más,:¿Puedo poner la ventana en fullscreen?

JMiur  

No sabría responderte, no he leido nada de eso.

Anónimo  

Estoy tratando de validar una pagina en la W3C y no me toma el atributo "caption". Se puede reemplazar por otro similar valido???.

JMiur  

Caption es un parámetro irremplazable y es parte del mismo script.

Anónimo  

En realidad el atributo "caption" se lo elimine, la pagina fue validada y, por supuesto, el script sigue funcionando correctamente sin el. Lo que me intersaria es poder agregar un texto a la foto sin ese atributo. Tenes alguna idea de lo que podria hacer???.

JMiur  

Como te dije, el atributo CAPTION es parte del script, es el que coloca ese texto por lo tanto, irremplazable.

Para usar otro, habría que modificar el script en si mismo.

ZZMidway  

Como puede ser posible que me salga en Opera y no me salga en Firefox ni IE6. En estos me sale la imagen pero descolocada y sin el marco.
http://zzmidway.com/2009/01/ratones.html

ZZMidway  

Tambien me sale un rectangulo que ocupa toda la pantalla en gris por culpa del lightwindow pero solo en firefox.

JMiur  

Lo que se ve en el código fuente es que el script de Post Relacioandos está mañ cerrado; se ve esto:

<script type='text/javascript'>
..........
..........
..........
<script type='text/javascript'>
function showpostcount(json) {
.............
</script>

De allí en adelante, el resultado es aleatorio. En este caso, no se carga lightwindow.js y por eso no funciona.

ZZMidway  

Ya lo he cerrado bien, pero me sigue pasando lo mismo. El lightwindow.css y el lightwindow.js son los que ahi aquí posteados pero subidas las imágenes por mi a otro sitio. Por cierto que el lightwindow.css no viene con el blank.gif, ni el que tienes subidas a imageshack tampoco esta. sl2s y thx.

JMiur  

Em mensaje de error que muestra Firefox es el siguiente:

"La hoja de estilo http://jscripts.ning.com/id/201909168 no fue cargada porque su tipo MIME, "text/javascript", no es "text/css"."

Imagino que es la hoja de estilo de LightWindow.

ZZMidway  

perfecto alojado en skydrive funciona la perfección. Muchas thx.

paxapadu  

JMuir

Funciona Lightwindow en paginas ASP.NET con Master Pages

saludos
Patricio desde Ecuador

JMiur  

Lo desconozco. Son escripts. Si funcionan otros, este no debería tener problemas en funcionar.

Usuario10  

Hoja JMiur, esto fue lo que hize.

1.- aloje estos 4 lightwindow.cssm lighwindow.js, scriptaculous.js, y el prototype.js en sky drive
2.- antes del /head coloque este codigo con el url modificado asi como muestro:
<script src='http://dzelsg.bay.livefilestore.com/y1pGQoPH5aUYZxXshy16q30xZMnIKnBA5-ARwtdCIO6GPSVYGi7S963INRtZHVGqjwILSg6f2Havfs/prototype.js' type='text/javascript'/>
<script src='http://dzelsg.bay.livefilestore.com/y1pN0YnTKC2d91u2qvhyN6irh8idHaFrBhwSp9lwG6dnAAACo6lo4NRutV14taEBgNy2MBpsH9c4ZM/scriptaculous.js?load=effects' type='text/javascript'/>
<script src='http://dzelsg.bay.livefilestore.com/y1pGQoPH5aUYZxUfr9G3rsGKyyUfU-JsFZ1PHF0WuUYZBfjUyMLCyE7llF8NTenn-9_UU2CrjCu_MU/lightwindow.js' type='text/javascript'/>
<link href='http://dzelsg.bay.livefilestore.com/y1pGQoPH5aUYZwPlju6jLQEvLUUYTjvY3NuXkySYcy92g6oi0fv4RxLKju__wE-B5YVOUSdOnJjVtc/lightwindow.css' media='screen' rel='stylesheet' type='text/css'/>

realize una entrada en el post abriendo una simple imagen. pero nunca me carga el blog. Este es mi blog de pruebas.

http://donwload-movies.blogspot.com/"

¿Cual sera mi error?

Gracias como siempre man.

Usuario10  

Ya encontre el error, era que estaba poniendo el scriptaculous.js y debi poner el effects.js.

Lo hize asi y pude me funciono con una imagen.

¿Sera que con eso queda JMiur?

Usuario10  

JMiur como le hago para ver un video de you tube? puse el enlace de un trailer de you tube pero me mostro la pagina completa no el reproductor pequeño.

Que tengo que hacer?

Pd. perdon por tanto mensaje, jejeje.

JMiur  

La URL para un video de YouTube es la misma que se usa en la etiqueta OBJECT:

http://www.youtube.com/v/idVIDEO

Alex  

Hola amigos, ante todo gracias por este gran post ya que gracias a el he podido instalar el ligthwindow en mi blog.
Mi pregunta es la siguiente, cuando quiero habrir otra web con el lightwindow no hay problema siempre y cuando sea .html, pero cuando es del tipo: .divx o .avi etc lo reconoce como video, el problema es que yo quiero que aparezca la web, no el video, hay alguna variable o algun parametro que se pueda añadir para que me habra la web?
Muchas gracias de antemano.
Saludos.

JMiur  

Imagino que reconoce las extensiones y de allí el problema. No se me ocurre ninguna solución al respecto ¿Tienes algúun ejemplo que pueda verse?

Alex  

Hola JMiur gracias por tu interes, yo quiero habrir esta web dentro de mi lightwindow:
http://www.mystream.to/file-6980-47a9ff17-S.A.S.1981.divx

 
CERRAR