lunes, 23 de agosto de 2010

Abrir ventana emergente pop-up con desplazamiento deslizante


Ya vimos anteriormente varias formas de abrir ventanas emergentes Pop-Up. Ver

Ahora abriremos una ventana Pop-Up con un efecto deslizante con desplazamiento desde arriba y hacia la derecha.

Colocaremos el código JavaScript.

Ir a Diseño, Edición de HTML y justo arriba de </head>

Poner el siguiente código:

<script type="text/javascript">
//<![CDATA[
function ventanadeslizante()
{
ancho=100
alto=100
fin=700
x=50
y=50
ventanaURL="http://www.google.com"

ventanades = window.open("", "_blank", "resizable,height=1,width=1,top=x,left=y,screenX=x,screenY=y,scrollbars=yes");
abrirVentanadeslz();
}
function abrirVentanadeslz();{;if

(ancho<=fin) {
ventanades.moveTo(x,y);
ventanades.resizeTo(ancho,alto);
x+=5
y+=5
ancho+=25
alto+=15
timersetTimeoututabrirVentanadeslzlz()",1)
}
else
{
clearTimeout(timer)
ventanades.location=ventanaURL
}
}
//]]>
</script>

Cambiar URL de la  página.

Se puede ajustar el tamaño de la ventana donde dice: fin=700

Para abrir la ventana hay que llamar a la función: ventanadeslizante()

Lo podemos hacer de varias formas, por ejemplo:

Desde un link:

<a href="javascript:ventanadeslizante()">Abrir Ventana</a>

Desde un botón:

<form>
<input type="button" value="Abrir Ventana" onClick="ventanadeslizante()"/>
</form>

Ver ejemplo:


No hay comentarios:

Publicar un comentario