The problem is only given to me in Firefox, I get an error: ReferenceError: $ is not defined
. I have read that it may be a Firefox certificate problem, but I have not solved it.
var count=0;
$('#invitado').click(function(){
if(count==0){
document.getElementById('sesion_popup').style.display='block';
document.getElementById('invitado').style.color='black';
document.getElementById('inicio_registro').style.display='none';
count=1;
}else{
document.getElementById('sesion_popup').style.display='none';
document.getElementById('invitado').style.color='blue';
document.getElementById('inicio_registro').style.display='flex';
count=0;
}
});
$('#sesion_usuario').click(function(){
if(count==0){
document.getElementById('panel_usuario_popup').style.display='block';
document.getElementById('sesion_usuario').style.color='black';
document.getElementById('inicio_registro').style.display='none';
count=1;
}else{
document.getElementById('panel_usuario_popup').style.display='none';
document.getElementById('sesion_usuario').style.color='blue';
document.getElementById('inicio_registro').style.display='flex';
count=0;
}
});
.usuario #sesion_popup {
position: absolute;
height: 205px;
background: #fff;
font-family: "Helvetica Neue Regular","Helvetica Neue",Helvetica,Arial,sans-serif;
z-index: 300;
width: 328px;
padding-top: 65px;
padding-left: 39px;
display: none;
left: -5px;
top: -5px;
box-shadow: .1px .1px 2px #888;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="sesion">
<a rel="nofollow" href="#" id="invitado">Invitado</a><div id="inicio_registro"><a class="iniciemos" href="https://www.laxtore.com/Iniciar-Sesion/">Iniciar Sesión</a><a href="https://www.laxtore.com/Registro/">Registrarse</a></div>
</div>
<div id="sesion_popup">
<a href="">Login avanzado</a>
<a href="">Registrarse</a>
<form class="credenciales" action="<?php echo $ruta ?>" method="post">
<div class="inputs">
<input type="text" name="usuario" placeholder="Usuario:">
<input type="password" name="password" value="Contraseña:">
</div>
<input class="submit_login" type="submit" name="submit_login" value="►">
</form>
</div>
EDITO: I was loading javascript this way:
'<script src="https://code.jquery.com/jquery-latest.js" type="text/javascript" async></script>'
Removing async
works everything correctly.