<!-- Codigo por http://adan-2994.es.tl/Iniciar_cerrar_sesion_desde_inicio.htm -->
<style type="text/css">
div#iniciar-cerrar-sesion{
display: none;
position: fixed;
top: 10%;
opacity: 0;
left: 28%;
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
width: 600px;
padding: 12px;
z-index: 3;
color: #fff;
border-radius: 2px;
-moz-border-radius: 10px;
-webkit-border: radius:10px;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
-moz-box-shadow:0 10px 20px rgba(0, 0, 0, 0.5);
-webkit-box-shadow:0 10px 20px rgba(0, 0, 0, 0.5);
border: 1px solid rgb(68, 68, 68);
}
div#iniciar-cerrar-sesion input[type="button"]{
background: #377ad0!important;
background: -moz-linear-gradient(top, #52a8e8 0%, #377ad0 100%)!important;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#52a8e8), to(#377ad0))!important;
border-top: 1px solid #4081af!important;
border-right: 1px solid #2e69a3!important;
border-bottom: 1px solid #20559a!important;
border-left: 1px solid #2e69a3!important;
-moz-border-radius: 5px!important;
-webkit-border-radius: 5px!important;
border-radius: 5px!important;
-moz-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3!important;
-webkit-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3!important;
color: #fff!important;
font-size: 12px!important;
font-weight: bold!important;
line-height: 1!important;
padding: 5px 10px!important;
text-align: center!important;
text-shadow: 0 -1px 1px #3275bc!important;
-webkit-background-clip: padding-box!important;
width: 75;
height: 28;
margin-left: 2px;
margin-top: 2px;
}
.art-form_login {
border-bottom: 1px solid #EDEDED;
float: left;
overflow: hidden;
padding: 0 0 8px;
width: 100%;
}
.art-form_login {
border-bottom: 1px solid #EDEDED;
float: left;
overflow: hidden;
padding: 0 0 8px;
width: 100%;
}
.art-input {
float: left;
padding: 15px;
width: 270px;
}
.art_notice {
background: none repeat scroll 0 0 #F4FCFF;
border: 1px solid #CAE9F5;
padding: 10px;
}
.art_notice span {
color: #0174C5;
font-size: 13;
line-height: 18px;
font-family: arial;
}
.art_notice span a {
color: #0174C5;
font-weight: bold;
}
.art_notice span a:hover {
color: #0091f7;
text-decoration:none;
}
.art-text_info {
color: #A4A4A4;
float: right;
font-size: 12px;
font-weight: normal;
margin: 2px 2px 0 0;
}
.box1 {
position: relative;
border: 0;
background: #FFF;
overflow: auto;
zoom: 1;
font-size: 12px;
line-height: 18px;
}
#login_box .login_cuerpo label {
color: #333333;
font-size: 1.15em;
margin-bottom: 2px;
}
.lista-login {
color: #9A9A9A;
float: right;
padding: 15px;
}
.left-login {
float: left;
padding: 15px;
}
.cerrarcecion1 {
-moz-border-bottom-colors: none;
-moz-border-image: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background: none repeat scroll 0 0 #E7E7E7;
border-bottom: medium none;
border-left: medium none;
border-right: medium none;
border-top: 1px solid #D1D1D1 !important;
box-shadow: 0 0;
margin: 0;
padding: 5px 10px;
position: relative;
text-align: left;
}
span.ui-button-text {
background: #377ad0!important;
background: -moz-linear-gradient(top, #52a8e8 0%, #377ad0 100%)!important;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#52a8e8), to(#377ad0))!important;
border-top: 1px solid #4081af!important;
border-right: 1px solid #2e69a3!important;
border-bottom: 1px solid #20559a!important;
border-left: 1px solid #2e69a3!important;
-moz-border-radius: 5px!important;
-webkit-border-radius: 5px!important;
border-radius: 5px!important;
-moz-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3!important;
-webkit-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3!important;
color: #fff!important;
font-size: 12px!important;
font-weight: bold!important;
line-height: 1!important;
padding: 5px 10px!important;
text-align: center!important;
text-shadow: 0 -1px 1px #3275bc!important;
-webkit-background-clip: padding-box!important;
}
span.CONECTATE {
color: #FFFFFF;
font-family: Arial,Tahoma,Helvetica,sans-serif;
font-weight: bold;
line-height: 1.4em;
margin-top: -28px;
position: absolute;
}
.imgdeentrada {
width: 80px;
height: 10px;
position: absolute;
margin-top: 115px;
z-index: 1;
margin-left: 128px
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script>$(document).ready(function(){
var accionpagina="Acceder.htm";
$("#abrir-contenedor-iniciar").click(function(e){e.preventDefault();$("div#iniciar-cerrar-sesion").css("display","block").animate({"top":"25%","opacity":"1"},300);$("div#iniciar-cerrar-sesion input#usuario").focus();});
$("div#iniciar-cerrar-sesion div#cerrarF").click(function(){$("div#iniciar-cerrar-sesion").animate({"top":"10%","opacity":"0","display":"none"},300);});
$("div#iniciar-cerrar-sesion input#entrar").click(function(){
if( $("div#iniciar-cerrar-sesion input#usuario").val()==""){alert("Introduce tu nombre de usuario");$("div#iniciar-cerrar-sesion input#usuario").focus();
}else if( $("div#iniciar-cerrar-sesion input#clave").val()==""){alert("Introduce tu contraseña");$("div#iniciar-cerrar-sesion input#clave").focus();
}else{entrar($("div#iniciar-cerrar-sesion input#usuario").val(),$("div#iniciar-cerrar-sesion input#clave").val());
/*cierra else y el click*/}});
$("div#iniciar-cerrar-sesion input#cerrar").click(function(){
$(document.body).css("cursor","wait");
$("div#iniciar-cerrar-sesion input#entrar,div#iniciar-cerrar-sesion input#cerrar,div#iniciar-cerrar-sesion input#clave,div#iniciar-cerrar-sesion input#usuario").attr("disabled","disabled").css("cursor","wait");
$.post(accionpagina,{mode:2,"logindata[checklogin]":1},function(res){
$(document.body).css("cursor","default");
$("div#iniciar-cerrar-sesion input#entrar,div#iniciar-cerrar-sesion input#cerrar,div#iniciar-cerrar-sesion input#clave,div#iniciar-cerrar-sesion input#usuario").attr("disabled","disabled").css("cursor","default");
window.location.reload(true);
});
});
function entrar(usu,pass){
$(document.body).css("cursor","wait");
$("div#iniciar-cerrar-sesion input#entrar,div#iniciar-cerrar-sesion input#clave,div#iniciar-cerrar-sesion input#usuario").attr("disabled","disabled").css("cursor","wait");
$.post(accionpagina,{"logindata[name]":usu,"logindata[kennwort]":pass,mode:1,checklogin:1,"logindata[checklogin]":1},function(respuesta){
$(document.body).css("cursor","default");$("div#iniciar-cerrar-sesion input#entrar,div#iniciar-cerrar-sesion input#clave,div#iniciar-cerrar-sesion input#usuario").removeAttr("disabled").css("cursor","default");
if(respuesta.indexOf("=>")!=-1 && respuesta.indexOf("Ahora")!=-1 && respuesta.indexOf("estás")!=-1 && respuesta.indexOf("conectado!")!=-1 ){
window.location.reload(true);
}else if(respuesta.indexOf("=>")!=-1 && respuesta.indexOf("contraseña")!=-1 && respuesta.indexOf("errónea!")!=-1){
alert("Tu Usuario o Contraseña es incorrecta");$("div#iniciar-cerrar-sesion input#clave").val("");$("div#iniciar-cerrar-sesion input#usuario").val("").focus();
}
/*cierra el post*/});
/*cierra funcion*/}
});</script>
<div id="iniciar-cerrar-sesion" >
<div id="cerrarF" style="background-image:url(http://s29.postimg.org/q3huoom37/close.png);background-repeat:no-repeat;height:16px;width:16px;cursor:pointer;margin-left: 587px;padding: 5px;">
</div>
<div class="imgdeentrada"><img src="http://s18.postimg.org/5sursj4dl/vikingo.png" width="90" height="150" style="-webkit-user-select: none; cursor: -webkit-zoom-out;" alt="" /></div>
<span class="CONECTATE">Conectarse</span>
<div class="art_notice">
<span>Recuerda no revelar tus datos y de leer el <a href="ACA AÑADE TU WEB DE FAQ O REGLAS !" style="text-decoration: none;">Protocolo</a></span>
</div>
<div class="box1" style="width: auto; min-height: 76px; height: auto;">
<div class="art-form_login">
<div class="art-input">
<tr><span class="art-text_info">Nombre de su cuenta</span>
<label style="color: #333333; font-size: 1.2em;margin-bottom: 2px;font-family: Arial,Helvetica;font-weight: bold;">Usuario</label>
<input id="usuario" type="text" placeholder="Usuario..." required="true" style="border-color: #CECECE #C6C6C6 #A4A4A4;border-left: 1px solid #C6C6C6;border-style: solid;border-width: 1px;width: 270px;padding: 6px 8px;border-radius: 3px 3px 3px 3px;"></tr>
</div>
<div class="art-input">
<tr><span class="art-text_info">Su password</span>
<label style="color: #333333; font-size: 1.2em;margin-bottom: 2px;font-family: Arial,Helvetica;font-weight: bold; ">Contraseña</label>
<input id="clave" type="password" required="true" placeholder="Contraseña" style="border-color: #CECECE #C6C6C6 #A4A4A4;border-left: 1px solid #C6C6C6;border-style: solid;border-width: 1px;width: 260px;padding: 6px 8px;border-radius: 3px 3px 3px 3px;"></tr>
</div>
</div>
<div class="lista-login">
<ul>
<li>Interactúa con los miembros de la comunidad</li>
<li>Únete y se parte de nuestra familia</li>
<li>Expresa tus ideas y opiniones sobre algun tema</li>
<li>Comparte lo que mas te gusta y recomiendanos</li>
</ul>
</div>
<div class="left-login">
<input type="button" id="entrar" value="Entrar">
<br>
<div class="login_footer">
<br>
</div></div>
</div>
<div class="cerrarcecion1">
<span style="color:#9A9A9A; margin-left: 115px; ">Solo tienes que precionar "Entrar" y esperar 5 segundos !</span>
</div>
</div>
<!-- Codigo por http://adan-2994.es.tl/Iniciar_cerrar_sesion_desde_inicio.htm -->
