viernes, 6 de septiembre de 2013

Redireccionador web Javascript

Redireccionador web Javascript 

Aqui les quiero compartir este codigo que sirve para redireccionar a alguna web que quieran ser llevada, es muy practica y sencilla de aplicar.. y tiene un contador que te indica el tiempo que se tardara, tambien un boton que lo dirige en el momento si no se quiere esperar.


Primero creamos el contenido html basico.



<html>
<head>
</head>
<body>
</body>
</html>

Dentro de las etiquetas <head></head> agregamos los el estilo

<style>
.textcontador{font-size:100px;border:0;text-align:center;background:transparent;}
.texttitulo{font-size:30px;}
.textlink{font-size:30px;color:#ddd}
.boton{
    background:#0D98FB;
    background-image: -webkit-linear-gradient(top,#0D98FB,#1A5DB3);
    background-image: -moz-linear-gradient(top,#0D98FB,#1A5DB3);
    background-image: -o-linear-gradient(top,#0D98FB,#1A5DB3);
    background-image: linear-gradient(to bottom,#0D98FB,#1A5DB3); 
    border: 1px solid #125CB5;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 1px 1px #71C0FD inset;
    -webkit-box-shadow: 0 1px 1px #71C0FD inset;
    -o-box-shadow: 0 1px 1px #71C0FD inset;
    box-shadow: 0 1px 1px #71C0FD inset;
    padding: .8em 1.8em;
    color: white;
    font-weight:normal;
    text-decoration:none;
}
.boton:hover {
    background:#1A5DB3;
    background-image: -webkit-linear-gradient(bottom,#0D98FB,#1A5DB3);
    background-image: -moz-linear-gradient(bottom,#0D98FB,#1A5DB3);
    background-image: -o-linear-gradient(bottom,#0D98FB,#1A5DB3); 
    background-image: linear-gradient(to top,#0D98FB,#1A5DB3);
    cursor: pointer;
}
</style>
Dentro de las etiquetas <body></body> agregamos el contenido

<center>
<font class="texttitulo"><b>Esta p&aacute;gina se redireccionar&aacute; en:</b></font>
<form name="redirect">
<input class="textcontador" size="1" name="redirect2"/>
</form>
<font><b>Segundos</b></font>
<font class="textlink"><b>a: http://vellenger.com</b></font>
<a class="boton" title="Ir Y&aacute;" href="http://vellenger.com">
Ir Y&aacute;
</a>
</center>
Y agregamos tambien en las etiquetas <body></body> el js

<script>
var targetURL="http://vellenger.com"
var countdownfrom=10
var currentsecond=document.redirect.redirect2.value=countdownfrom+1
function countredirect(){
if (currentsecond!=1){
currentsecond-=1
document.redirect.redirect2.value=currentsecond
}
else{
window.location=targetURL
return
}
setTimeout("countredirect()",1000)
}
countredirect()
</script>
Solo cambian las url por las suyas y si quieren cambiar el tiempo lo hacen en esta variable:


varcountdownfrom=10









  


 
 
 
 

No hay comentarios:

Publicar un comentario