JQuery Pop-up

Compartir

Se trata de un sencillo sistema basado en JQuery para forzar el pop-up de una ventana (en Firefox) o para abrir en una nueva pestaña (en Explorer).

Recordar antes que con el uso de ventanas modales (esto es una ventana modal), el uso de los pop-up cada vez es más reducido.

Sin embargo, hay algunas webs que o no cargan en ventanas modales o simplemente no se muestran, como es el caso de Twitter. Así que si queremos mostrarla de manera que el usuario no "salga" de nuestro dominio, tan sólo nos queda utilizar el pop-up (en mi caso, por la sustitución del widget de seguidores, aunque eso es otra historia...).

Para utilizar este sistema, por supuesto tienes que tener insertada en la plantilla la llamada a la librería Jquery, en este caso y como recomendación, utilizando la API de Google.

[+]Ver código

Poner antes de </head> (si no lo tienes puesto antes)
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js' type='text/javascript'></script>

Y a continuación, el script en sí.

[+]Ver código

<script type='text/javascript'>
$( document ).ready( function() {
$(&quot;a[rel=&#39;pop-up&#39;]&quot;).click(function () {
var caracteristicas = &quot;height=700,width=800,scrollTo,resizable=1,scrollbars=1,location=0&quot;;/* Aquí estableces las medidas y el resto de características*/
nueva=window.open(this.href, &#39;Popup&#39;, caracteristicas);
return false;
});
});
</script>

Después, siempre que quieras abrir una ventana pop-up, tan sólo tienes que poner rel="pop-up" para que se abra en una ventana con esas características:

<a href="http://www.banakabanaka.com/home.php" rel="pop-up">ABRIR POP UP</a>
ABRIR POP UP
Y probamos con Twitter

La pena es que en el Explorer se abre un nueva pestaña, pero bueno, ya sabemos lo que pasa con ese navegador....



Para saber más:
JQuery.com