elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: AIO elhacker.NET 2021 Compilación herramientas análisis y desinfección malware


+  Foro de elhacker.net
|-+  Programación
| |-+  Programación General
| | |-+  Problema con atributo z-index
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Problema con atributo z-index  (Leído 1,051 veces)
Arm144

Desconectado Desconectado

Mensajes: 13


Ver Perfil
Problema con atributo z-index
« en: 22 Mayo 2017, 21:11 pm »

Buenas, estaba creando una validación de errores cuando me he topado con el problema de que al mostrar un div como de error, me empuja hacia abajo los elementos del formulario, cuando me gustaría que este por encima de ellos, he utilizado el atributo z-index en el css pero no se realiza. Si alguien fuese tan amable de explicarme o decirme como solucionarlo, estaría encantado.
Muestro acá los códigos js,html y css:

HTML:
Código:
<tr>
<td>Contraseña:</td>
<td>
<input type='password' name='pwdIn' id='pwdIn' placeholder='Introduzca su contraseña'>
<div id="errorPwd" class="errorPass">
<h4>La contraseña debería cumplir los siguientes requisitos:</h4>
<ul>
<li id="largo" class="invalid">Debe tener almenos <strong>8</strong> caracteres.</li>
<li id="mayuscula" class="invalid">Debe contener almenos <strong>1 letra mayúscula</strong>.</li>
<li id="minuscula" class="invalid">Debe contener almenos <strong>1 letra minúscula</strong>.</li>
<li id="numero" class="invalid">Debe contener almenos <strong>1 número</strong>.</li>
</ul>
</div>
</td>
</tr>

JS:
Código:
function validarPwd(){
var valido;
if(!contraseña.val().match(/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z0-9]{8,}/g)){
valido=false;
}else{
valido=true;
}
return valido;
}
contraseña.focusin(function(){
contraseña.attr('style', 'background:#87CEEB');
});
contraseña.keyup(function(){
var pwd = contraseña.val();
        //validate the length
        if ( pwd.length < 8 ) {
            $('#largo').removeClass('valid').addClass('invalid');
        } else {
            $('#largo').removeClass('invalid').addClass('valid');
        }

        //validate letter
        if ( pwd.match(/[a-z]/) ) {
            $('#minuscula').removeClass('invalid').addClass('valid');
        } else {
            $('#minuscula').removeClass('valid').addClass('invalid');
        }

        //validate capital letter
        if ( pwd.match(/[A-Z]/) ) {
            $('#mayuscula').removeClass('invalid').addClass('valid');
        } else {
            $('#mayuscula').removeClass('valid').addClass('invalid');
        }

        //validate number
        if ( pwd.match(/\d/) ) {
            $('#numero').removeClass('invalid').addClass('valid');
        } else {
            $('#numero').removeClass('valid').addClass('invalid');
        }
$('#errorPwd').slideDown();
}).blur(function() {
if(validarPwd()===false){
contraseña.attr('style', 'border:3px solid #FF4A4A');
$('#errorPwd').show();
}else{
contraseña.attr('style', 'background:#E4FAD3');
$('#errorPwd').hide();
}
});

CSS:
Código:
.errorPass{
display: none;
width: 350px;
background: #000000;
border-radius: 5px;
color: white;
z-index: 1;
}
.invalid {
background:url(../imagenes/cancel.png) no-repeat 0 50%;
padding-left:22px;
line-height:24px;
color:#ec3f41;
}

.valid {
background-image:url(../imagenes/accept.png) no-repeat 0 50%;
padding-left:22px;
line-height:24px;
color:#3a7d34;
}


En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Problema con Atributo %0
Scripting
NoryNR 2 1,533 Último mensaje 18 Febrero 2008, 17:01 pm
por NoryNR
[MySQL] Dividir atributo en dos
Bases de Datos
Kasswed 4 6,153 Último mensaje 10 Mayo 2011, 00:44 am
por Kasswed
(solucionado) Que es el atributo "A"? (Atributo de archivo de almacenamiento.)
Windows
Eleкtro 2 21,866 Último mensaje 31 Enero 2012, 01:00 am
por Eleкtro
¿Alternativa al atributo RangeAttribute de ASP.NET?
.NET (C#, VB.NET, ASP)
Eleкtro 2 1,196 Último mensaje 4 Octubre 2014, 20:31 pm
por Eleкtro
Array atributo de una clase de tamaño igual a otro atributo
Programación C/C++
cNoob 3 1,382 Último mensaje 1 Enero 2018, 21:02 pm
por cNoob
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines