Ciao a tutti,
Vorrei un aiuto per riuscire ad ovviare ad un problema che ho riscontrato con un plugin jQuery che ho trovato sul web, ma che ho modificato per adattarlo alle mie esigenze, e che però non funziona a dovere.
In sintesi, in uno dei miei siti web, devo far apparire nella pagina di registrazione degli utenti, registrazione.php, un overlay dinamico al caricamento della pagina.
Fin qui tutto ok, il problema però avviene quando un utente erroneamente non compila un campo obbligatorio, o mette un email errata ecc, (tutti controlli che faccio con PHP) e preme sul pulsante INVIA, ed ecco che appare l'overlay dinamico con il box, dove ho inserito un avviso con delle info utili per il mio nuovo utente.
mentre vorrei che NON apparisse più, avendo già informato il mio utente al momento del caricamento della pagina!.
Se sbaglia ancora, ricompare sempre il box, cosa che risulta ovviamente fastidiosa!.
Non so come dire a jQuery di far apparire il box SOLO ED ESCLUSIVAMENTE al caricamento della pagina, la prima volta e basta.
Qui metto il codice CSS che uso:
codice:
.overlay2 {
background: #000;
position: fixed;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
z-index: 100;
cursor: pointer;
/* Trasparenza */
opacity: .7;
}
#box2 {
width: 600px;
height: 400px;
background-color: #FFF;
display: none;
z-index: +300;
position: absolute;
left: 20%;
right: 20%;
bottom: 700px;
/* Angoli arrotondati del box */
border-radius: 15px;
}
#box2 hr {
border-color: #CCCCCC;
border-right: 0 solid #CCCCCC;
border-style: solid;
border-width: 1px 0 0;
width: 60%
}
.titolo_box
margin-left: 40px;
font-weight: bold;
font-size: 22px;
}
.testo-box {
margin: 20px;
width: 90%;
}
/* Trasformo la x, per la chiusura box, in un elemento di blocco */
.chiudi {
font-size: 18px;
color: #000;
font-weight: bold;
position: absolute;
right: 2%;
top: 0%;
cursor: pointer;
}
Questo invece il codice HTML che ho inserito nella pagina registrazione.php:
codice HTML:
<div class="overlay2" id="overlay2" style="display:none;"></div>
e poi sotto:
codice HTML:
<div id="box2">
<div class="titolo_box">Avviso importante</div>
<p class="testo-box">"Se avete problemi in fase di registrazione, e <span class="grassetto_e_rosso">dopo qualche minuto NON ricevete l'email per l'attivazione del vostro account</span>, controllate con il vostro browser (Firefox, Chrome ecc.) nello <span class="grassetto">spam</span> della vostra email qui inserita, se il software del gestore del vostro account, non l'abbia considerata appunto come tale. Infatti <span class="sottolineato">alcuni programmi di posta etichettano quale "spam" le email con i link attivi per pagine web.</span> Grazie. "
</p>
<hr />
<p class="chiudi">X</p>
</div> <!--fine box-->
Ecco il plugin jQuery che ho modificato, ed inserito tra <head> e </head> e l'ho chiamato jquery.overLay.js, e che non dovrebbe "ripresentarsi" ad ogni eventuale errore nella compilazione del form di un nuovo utente.
codice:
$(document).ready(function() {
$('#overlay2').fadeIn('fast');
$('#box2').fadeIn('slow');
$(".chiudi").click(
function(){
$('#overlay2').fadeOut('fast');
$('#box2').hide();
});
//chiusura emergenza
$("#overlay2").click(
function(){
$(this).fadeOut('fast');
$('#box2').hide();
});
});
Grazie in anticipo.
Ciao.