Popup si apre senza click

Ho questo codice che crea un popup, gli ho inserito un form ma si apre da solo quando apro la home ma ci sono 2 problemi:

1. Se clicco sulla X non si chiude (solo con FF)
2. vorrei aprirlo quando si clicca su un link

http://www.photoman.altervista.org

a parte il form, questo è praticamente l'unico codice js

<a href="#" onclick="bannerX.style.display='none';chiudiX.style.display='none'">Chiudi X</a> 

Sostituisci il codice che hai scritto con questo (per far chiudere i div):

<a href="#" onclick="getElementById('bannerX').style.display='none';getElementById('chiudiX')getElementById('.style.display='none'">Chiudi X</a> 

Poi aggiungi al div "bannerX" e al div "chiudiX" la seguente porprietà (per non farli comparire all' inizio):

style="display: none" 

Infine aggiungi questa proprietà ad un link (per far comparire i div quando si clicca sul link):

onclick="getElementById('bannerX').style.display='block';getElementById('chiudiX').style.display='block';" 

Sostituisci il codice che hai scritto con questo (per far chiudere i div):

<a href="#" onclick="getElementById('bannerX').style.display='none';getElementById('chiudiX')getElementById('.style.display='none'">Chiudi X</a> 

Poi aggiungi al div "bannerX" e al div "chiudiX" la seguente porprietà (per non farli comparire all' inizio):

style="display: none" 

Infine aggiungi questa proprietà ad un link (per far comparire i div quando si clicca sul link):

onclick="getElementById('bannerX').style.display='block';getElementById('chiudiX').style.display='block';" 

Senti, dovrei mettere anche il background semitrasparente quello che copre tutto ciò che c'è sotto, ce l'hai presente?
Poi, quando ho inviato esce il messaggio OK ma la pag php col messaggio OK non si chiude

Questi sono corretti:

display:none;


<a href="#" onclick="getElementById('bannerX').style.display=' none';getElementById('chiudiX').style.display='non e'">Chiudi X</a>

<a href="javascript:void(0)" onclick="getElementById('bannerX').style.display=' block';getElementById('chiudiX').style.display='bl ock';">@mail</a>

<style type="text/css">
#X {
background-color:red;
width:900px;
height100px;
}

#bannerX {
position:absolute;
width:400px;
height:auto;
margin-left:280px;
margin-top:100px;
display:none;
}

#chiudiX{
position:absolute;
background-color:white;
width:52px;
height:30px;
font-family:arial;
font-size:12px;
font-weight:bold;
text-decoration:none;
margin-left:631px;
margin-top:84px;
text-align:center;
display:none;
}

#chiudiX a:link{
background-color:white;
width:52px;
height:30px;
font-family:arial;
font-size:12px;color:black;
font-weight:bold;
text-decoration:none;
text-align:center;
}
#chiudiX a:hover{
background-color:white;
width:52px;
height:16px;
font-family:arial;
font-size:12px;color:red;
font-weight:bold;
text-decoration:none;
text-align:center;
}

</style> 

<!-- Inizio codice POP-UP -->
<div id="X">
<div id="chiudiX">
<a href="#" onclick="getElementById('bannerX').style.display='none';getElementById('chiudiX').style.display='none'">Chiudi X</a>  
</div>  <!-- chiudiX -->

<div id="bannerX">
<form method="post" action="scrivimi2.php" id="mioform1" onkeyup="highlight(event)" onsubmit="return (xxx1() &amp;&amp; controlla1())">
<fieldset id="contenuto1">
<div id="headerFormScrivimi">SCRIVIMI</div>
                
<div class="linea1">
<label class="nomi1">Tuo NOME&nbsp;<span class="asterisco-scrivimi1">*</span></label>
<input class="campi1" name="nome" value="" size="30"  type="text" maxlength="15" onblur="this.value=this.value.replace(/\s*$|^\s*/,'')" />  <!-- E' il Trim di js (onblur rimuove subito quando si esce dal campo in modo visibile spazi prima e alla fine  -->

&nbsp;<img src="faccine/cxonfuso.gif" alt="Confuso" title="Confuso" onclick="document.forms.mioform1.messaggio.value+='Cxonfuso';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
&nbsp;<img src="faccine/ixmpossibile.gif" alt="Impossibile" title="Impossibile" onclick="document.forms.mioform1.messaggio.value+='Ixmpossibile';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
&nbsp;<img src="faccine/txestardo.gif" alt="Testardo" title="Testardo" onclick="document.forms.mioform1.messaggio.value+='Txestardo';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
</div>
<div class="linea1">
<label class="nomi1">Tua EMAIL&nbsp;<span class="asterisco-scrivimi1">*</span></label>
<input class="campi1" name="suoemail" value="" size="30" type="text" maxlength="30" onblur="this.value=ignoreSpaces(this.value)" />   <!-- Rimuove tutti gli spazi (attacca le parole) -->
&nbsp;<img src="faccine/pxiange.gif" alt="Piange" title="Piange" onclick="document.forms.mioform1.messaggio.value+='Pxiange';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
&nbsp;<img src="faccine/bxacio.gif" alt="Bacio" title="Bacio" onclick="document.forms.mioform1.messaggio.value+='Bxacio';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
&nbsp;<img src="faccine/fxelice.gif" alt="Felice" title="Felice" onclick="document.forms.mioform1.messaggio.value+='Fxelice';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
</div>
<div class="linea1">
<label class="nomi1">Tua CITTA'</label>
<input class="campi1" name="citta" value="" size="30" type="text" maxlength="15" onblur="this.value=this.value.replace(/\s*$|^\s*/,'')" />
&nbsp;<img src="faccine/rxide.gif" alt="Ride" title="Ride" onclick="document.forms.mioform1.messaggio.value+='Rxide';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
&nbsp;<img src="faccine/oxcchiolino.gif" alt="Occhiolino" title="Occhiolino" onclick="document.forms.mioform1.messaggio.value+='Oxcchiolino';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
&nbsp;<img src="faccine/cxiao.gif" alt="Ciao" title="Ciao" onclick="document.forms.mioform1.messaggio.value+='Cxiao';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
</div>
<div class="linea1">
<div class="formattazione1">
            
<div id="bottoneB">         
<a href="javascript:insert_tag('B');">B</a>
</div>
<div id="bottoneI"> 
<a href="javascript:insert_tag('I');">I</a>    
</div>
<div id="bottoneU"> 
<a href="javascript:insert_tag('U');">U</a> 
</div>

<select class="campoColori1" onchange="insert_tag('COLOR',this.options[this.selectedIndex].value);this.selectedIndex=0;">
<option>Color</option> 
<option value="blue" class="turchese-color">blue</option>
<option value="red" class="rosso-color">red</option>
<option value="green" class="verde-color">green</option>
<option value="gray" class="grigio-color">gray</option>
<option value="black" class="nero-color">black</option>
</select>
</div> <!-- formattazione1 -->
<label class="nomi1">&nbsp;&nbsp;&nbsp;&nbsp;TESTO&nbsp;<span class="asterisco-scrivimi1">*</span></label>    
<textarea name="messaggio" id="txtScrivimi1" cols="0" rows="0" onkeyup="conta(this.form);" onfocus="this.value=this.value.replace(/\s*$|^\s*/,'')"></textarea> <!-- quì c'è onfocus perchè se mettessi onblur non mette i tag di formattazione in sequenza -->
&nbsp;<img src="faccine/pxaura.gif" alt="Paura" title="Paura" onclick="document.forms.mioform1.messaggio.value+='Pxaura';document.forms.mioform1.messaggio.focus()" style="cursor:pointer" />
</div>
</fieldset>
<div id="footer-scrivimi1">
<div id="footer-sx-scrivimi1">
<span class="asterisco-scrivimi1">*&nbsp;</span><span class="campiObb-scrivimi1">Campi obbligatori</span>
</div>
<div id="footer-ct-scrivimi1">
<input type="submit"  value="Invia" class="manina" />
</div>
<div id="footer-dx-scrivimi1">
<span class="rimanenti-scrivimi1">Max&nbsp;&nbsp;<input value="500" name="num" id="num-scrivimi1" readonly="readonly" />&nbsp;caratteri</span>
</div>
</div> <!-- footer-scrivimi1 -->
</form>
</div> <!-- bannerX -->
</div> <!-- X -->
<!-- Fine codice POP-UP -->