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=700x=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:
Muy bueno el efecto, he visto efectos similares como el de que la ventana ' se vuelve loca' al abrirse, moviéndose de un lado al otro, pero éste está muy original :6)
Saludos
sorry if me wrong...
whats the same in writed kode like...
function abrirVentanadeslz()
{
and...
function abrirVentanadeslz();{;if
because in your sample this is script good, for script in your post no good...
sorry my englisg bad, i hope you understand what i am mean :23)
Beben amigo. Lo siento, no entendi nada, solo algunas palabras.
Si tienes alguna opinión respecto a la entrada, tienes un punto de vista distinto, o simplemente quieres saludar, te invito a que dejes un comentario. NO SE ACEPTAN LINKS DE REFERIDOS para que los comentarios no se conviertan simplemente en una forma de publicitarse.
Elegir un botón o imagen, Seleccionar, copiar (Ctrl+C) y pegar en formulario de comentarios.
Nota: solo los miembros de este blog pueden publicar comentarios.