19

Pop-up controlado (I)

Con un sencillo código crearemos un pop-up o ventana emergente, que nuestros visitantes podrán abrir pinchando en un link.
Podemos usarlo para mostrar una imagen, incluso una captura de otra web, cambiando la url por la de la imagen o del sitio web que queramos mostrar. Eso si, tendremos en cuenta que la ventana tendrá el tamaño que nosotros queramos, sin que nuestros visitantes tengan la posibilidad de agrandarla.

Para mostrar el efecto en nuestra sidebar, en la parte de diseño de nuestra plantilla elegimos un nuevo elemento HTML-Javascript y pegamos el código:

<a href="http://URL-DE-TU-IMAGEN O DE LA PAGINA WEB" target="_blank" onclick="window.open(this.href, this.target, 'width=313,height=450'); return false;">Abrir ventana</a>

Ejemplo:

Un perro precioso

Mi otro blog

Nota:
Donde pone width=300 y height=400 en el código, es donde modificaremos el alto/height y el ancho/width de nuestro pop up.

Entradas Relacionadas:

19 comentarios:


p3p0

Gracias por el pop-up controlado Rosa, como siempre cosas muy útiles, he intentado probarlo en la respuesta al comentario que me has dejado sin caer en que ahí no se puede..., en otra ocasión será, hasta pronto.

Neo

Muy bonito el pop-up controlado, ya lo estoy utilizando para mi sección de pósters.
Pero el incoveniente que tengo es que por ejemplo en una imagen que tengo de 510x755, al ponerle este pop-up con esas dimesiones no se ve la imagen total. ¿No hay alguna forma para que la imagen se pueda desplazar hacia abajo con las barras laterales que hay normalmente a la derecha? No se si me explico bien.

Gracias por este truco. Sigo mejorando mi blog gracias a tí.

Saludos.

Neo

Rosa, ¿alguna solución o no?

Es que no sé si has leído el mensaje.
Saludos.

Rosa

Neo, perdona, :-$ había visto tu consulta, pero se me pasó responderte.
He encontrado otra forma de mostrar un popup más o menos como dices, va con un script y ya lo tengo en borradores para publicar, de ahí que le haya cambiado el título a este post "poup controlado (I), no obstante sigo buscando más sobre el tema, así que tu tranquila, algo apropiado seguro que encontramos. ;-)

Neo

Vale, yo sigo tranquilo a la espera de que lo publiques en tu Blog.

Una vez más muchisímas gracias.

Saludos.

Rodrigo

muy bueno tu ayuda con el pop up controlado... es algo que biuscaba... sin embargo tengo la itencion de usarlo con una imagen en la sidebar, no con el texto "abrir ventana"... me podrías ayudar con eso?.. ya que intenté buscar alguna forma y no me dio resultado... muchas graciaas

Rosa

Rodrigo, para usar el popup en la sidebar con una imagen, esta no puedes subirla con el elemento "Imagen" de Blogger, tienes que subirla antes a un alojamiento de imágenes y sustituir donde dice "Abrir ventana" en el código por la url de tu imagen:
<img src="Url_de_la_imagen"/>

-¦-= Shadow†Sneak =-¦-

Hola, una pregunta en esa parte que colocaste: "Eso si, tendremos en cuenta que la ventana tendrá el tamaño que nosotros queramos, sin que nuestros visitantes tengan la posibilidad de agrandarla." te abra faltado algo mas? porque la ventana si se puede agrandar, si fuera eso que dije me serviría mucho para encerrar SWF ya que la normal que tengo ahora no me serviría para los SWF ya que aumenta el tamaño del SWF.

bueno espero respondas.je..

saludos.

Rosa

-¦-= Shadow†Sneak =-¦- Lo siento, cuando publiqué esta entrada y con este código, la ventana no mostraba la barra de usuario... no se porque ahora si lo hace, supongo que es cosa de las funciones de los nuevos navegadores...

ZETSU

no hay alguna forma de crearlo para que se abra automaticamente al cargar la pagina :((

Rosa

ZETSU Algo hay si, aunque es una verdadera molestia eso para cualquier usuario... yo no tengo nada publicado de ese tipo, pero no es difícil de encontrar en Google.

LGzx

Hmmmm... muy bueno el material. Quería preguntarte si sabes como hacer un pop-up con una ventana personalizada y que no se pueda agrandar.

Rosa

LGzx Pues no, lo siento:(

SeÑoRwEb

MUY BUENO

Felipe

Vamos a probarlo!
Gracias por la información :)

Norberto

Hola: una cosulta
¿Porque si escribo este script: window.open(url,'title','toolbar=no,directories=no,menubar=no,status=no,scrollbars=no,resizable=yes,width=800,height=600'); la barra de estado y la barra de direcciones igual me salen en la ventana Popup, si la lanzo desde un post de blogger. Si utilizo ese mismo script no en blogger, sino en un servidor de hosting comun, funciona perfectamente (me borra la statusbar y la barra de direcciones).

Rosa

Norberto Ni idea... lo que si puedo decirte es que en Blogger hay códigos que no funcionan como lo hacen en otros servicios...

Norberto

Hola Rosa

Te agradezco mucho tu respuesta, pero seguí averiguando y el hecho de no poder suprimir la barra de navegación y la barra de estado en una ventana emergente (popup), no es un problema propio de blogger, sino de los navegadores modernos (IE7, IE8, Chrome y firefox). No premiten suprimir la barra de navegación por razones de seguridad (phishing), porque sería mas fácil engañar a la gente con una dirección falsa (al permanecer oculta).
Yo había creado un documento html (con ese script) y al abrirlo desde mi HD funcionaba bien (ocultaba ambas barras), pero ahora lo subí a un servidor común y aparece el mismo problema.
El uso que yo le quiro dar es para lanzar videos en un popup, que resulta bastante útil.
Pueden ver el ejemplo aquí: http://snow.prohosting.com/zss/1/
Haciendo clic sobre la imágen (vista previa) se abre el video en una ventana emergente.
El código lo pueden ver en la página de ejemplo (Página- ver código fuente), lamentablemente no se puede pegar codigo html en estos comentarios.

Rosa

Norberto Muchas gracias por compartir tu experiencia. :D

Publicar un comentario en la entrada

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S