Creazione DIV dinamicamente ed Errore in IE

[angelomorto]

Ho creato uno script che alla pressione del "link" LOGIN mi fa comparire una div in stile Litebox con uno sfondo trasparente e una div centrale che contiene le box di input per login e password al mio sito.

La cosa strana è che con Fireforx funziona regolarmente e non mi da nessun errore nella console degli errori, mentre in internet explorer funziona solo una volta, mentre la seconda volta che clicco su LOGIN mi da questo errore...

Riga: 31
Carattere: 8
Errore: "style" è nullo o non è un oggetto
Codice: 0

alla riga 31 del file javascript ho questo....

function createTransparentBox(){
                         createDiv('transparentBox');
                         var element = getElement('transparentBox');
                         element.style.position="absolute";
    Riga 31  --->         element.style.top="0";
                         element.style.left="0";
                         element.style.width="100%";    
                         element.style.height="100%";    
                         element.style.backgroundColor="#000000";
                         if(ie4||ie5)element.style.filter="alpha(opacity=50)";
                   if(ns6||!ie4||!ie5)element.style.MozOpacity=.5;
                         element.style.zIndex=1;                         
        }

function createDiv(name){
                                                                          var DivObj; // our Div object
                                          if (!DivObj && document.createElement) {
                                            // create the Div and assign a reference to the
                                            // object to our global variable DivObj.
                                            // this will only happen the first time 
                                            // callToServer() is called
                                           try {
                                              var tempDiv=document.createElement('div');
                                              tempDiv.setAttribute('id',name);
                                              DivObj = document.body.appendChild(tempDiv);                                             
                                            } catch(exception) {
                                              // This is for IE5 PC, which does not allow dynamic creation
                                              // and manipulation of an iframe object. Instead, we'll fake
                                              // it up by creating our own objects.
                                              divHTML='\<div id="'+name+'"></div>';
                                              document.body.innerHTML+=divHTML;                           
                                            }
                                          }
        }


function getElement(idelement){
    if (document.all){ // msie browsers
                           var elmRef = document.all[idelement];
              } else if (document.layers){
                           var elmRef = document.layers[idelement];
              } else if (document.getElementById){
                           var elmRef = document.getElementById(idelement);
              }
                            return elmRef;
}

function center(ele){
                        ele.style.position="absolute"; 
            ele.style.marginLeft = "-" + parseInt(ele.offsetWidth / 2) + "px";
                    ele.style.marginTop = "-" + parseInt(ele.offsetHeight / 2) + "px";
                        ele.style.top="50%";
                        ele.style.left="50%";

        } // end function
        
function hideBox(idelement){                         
                         var element = getElement(idelement);
                         element.style.width="0px";
                         element.style.height="0px";
                         element.style.display="none";
                         element.innerHTML = "";
                         element.Destroy;    
        }
                
function showLogin(){                                                  
                         var str = '<div style="text-align:right;font-size:.8em;padding-top:6px;padding-right:6px;">[url="javascript:void(0);"]Chiudi[/url]</div>

';
                         str += 'Username:
<input type="text" size="30" id="username" name="username" value="" />

';
                         str += 'Password:
<input type="text" size="30" id="password" name="password" value="" />

';
                         str += '<input type="button" name="Invia" Value="Invia" onclick="sendLogin();" />

';
                         createTransparentBox();
                         createDiv('boxlogin');                         
                         var element = getElement('boxlogin');
                         element.style.width="250px";
                         element.innerHTML=str;    
                         element.style.paddingLeft="40px";
                         element.style.zIndex=1;
                         element.style.backgroundColor="#ffffff";                     
                         center(element);
        } 

qualcuno sa trovare l'errore? :P

[angelomorto]

Sapevo che era una cosa difficile! :P
Ma nn c'è nessuno che ha la botta di culo che trova l'errore? :P

[diego2000]

prova ad aggiungere px dopo lo 0

element.style.top="0";
element.style.left="0";

[cavicchiandrea]

L'errore è un po strano, e IE con il DOM ha qualche deficit (leggi interpretazione propria).
Se non ho capito male (non sono un esperto) il div viene creato exnovo, ma non lo distruggi alla chiusura lo rendi invisibile, o sbaglio?
In tal caso io proverei a distruggerlo, se l'errore persiste ho detto una fesseria, altrimenti hai risolto, cosi mi spiegherei il funzionamento solo al primo tentativo.
Comunque qui trovi ottimi consigli.

[angelomorto]

Originariamente inviato da diego2000
prova ad aggiungere px dopo lo 0

element.style.top="0";
element.style.left="0";

Niente da fare, l'errore persiste....anche perchè la prima volta che ci clicco la div si posizione in modo corretto!!!!

[angelomorto]

Originariamente inviato da cavicchiandrea
L'errore è un po strano, e IE con il DOM ha qualche deficit (leggi interpretazione propria).
Se non ho capito male (non sono un esperto) il div viene creato exnovo, ma non lo distruggi alla chiusura lo rendi invisibile, o sbaglio?
In tal caso io proverei a distruggerlo, se l'errore persiste ho detto una fesseria, altrimenti hai risolto, cosi mi spiegherei il funzionamento solo al primo tentativo.
Comunque qui trovi ottimi consigli.

Quando chiudo la "litebox" con la funzione hideBox alla fine del reset dei vari parametri c'è già la funzione element.Destroy .... ho provato anche con element = null ... ma niente da fare....per curiosità ho provato a mettere all'interno della funzione createTransparentBox() prima della riga 31 un alert(typeof(element.style)) e la prima volta che lancio la funzione mi restituisce "object" mentre la seconda volta mi dice "undefined" , quindi vuol dire che non riesce a ricreare l'oggetto DIV.....come mai??? :master:

[angelomorto]

Ok, ho modificato la funzione...

function hideBox(idelement){                        
                         var element = getElement(idelement);
                         element.style.width="0px";
                         element.style.height="0px";
                         element.style.display="none";
                         element.innerHTML = "";
                         element.Destroy;    
        } 

con

function hideBox(idelement){                         
                 var element = getElement(idelement);
             document.body.removeChild(element);
        } 

ed ora funziona....!!!! :P