appendchildl e createelement su ie e ff

[alecsss]

Salve a tutti,
volevo creare un messaggio di alert personalizzato ma non capisco per quale ragione il seguente codice funziona bene su ff ma non su ie...
La funzione viene chiamata attraverso crea("mio messaggio") Spero che qualcuno sappia darmi consigli in merito

function crea(messaggio) {
nuovo_elemento = document.createElement("div");
nuovo_elemento.setAttribute("id","Popup");
nuovo_elemento.setAttribute("class","transparent") ;
nuovo_elemento.setAttribute("type", "text/css");
nuovo_elemento.innerHTML= "
" + messaggio + "<div>
CHIUDI</div>";
document.getElementById("container").appendChild(n uovo_elemento);
obj=eval("document.getElementById(\"Popup\")");
obj.style.height="100px";
obj.style.width="500px";
obj.style.border="1px #000000 dotted";
obj.style.margin="0px";
obj.style.filter = "alpha(opacity:80)";
obj.style.backgroundcolor = "#00C100";
obj.style.zIndex = 10000;
x = document.body.scrollLeft + windowWidth()/2 - 250;
y = document.body.scrollTop + 300;
obj.style.left = x + "px";
obj.style.top = y + "px";
obj.style.display="block";
}
function Hide() {
/* hide the pop-up */
document.getElementById("Popup").style.display="no ne";
}

function windowWidth() {
if (window.innerWidth){
if (document.body.offsetWidth){
if (window.innerWidth!=document.body.offsetWidth)
return document.body.offsetWidth;
}
return (window.innerWidth); // Mozilla
}


if (document.documentElement.clientWidth)
return document.documentElement.clientWidth; // IE6


if (document.body.clientWidth)
return document.body.clientWidth; // IE DHTML-compliant any other

}

[deleted_110]

cosa intendi per 'non funziona bene'?

Io l'ho provata in fretta su IE6 e FF e si comporta allo stesso modo.

Beh, non ho i tuoi css per cui non so bene come vorresti apparisse. Pero' il div c'e'.

[deleted_110]

Beh, un appunto

se il div deve apparire e scomparire piu' volte e' inutile crearlo tutte le volte. e' sufficiente la prima. Quindi fai un controllo per vedere se il div esiste gia'

qualcosa del genere

function crea(messaggio) {
  obj = document.getElementById("popup");
  if(!obj)
  {
  nuovo_elemento = document.createElement("div");
  nuovo_elemento.setAttribute("id","Popup");
  nuovo_elemento.setAttribute("class","transparent");
  nuovo_elemento.setAttribute("type", "text/css");
  nuovo_elemento.innerHTML= "
" + messaggio + "<div>
[url='javascript:Hide()']CHIUDI[/url]</div>";
  document.getElementById("container").appendChild(nuovo_elemento);
  obj=eval("document.getElementById(\"Popup\")");
  obj.style.height="100px";
  obj.style.width="500px";
  obj.style.border="1px #000000 dotted";
  obj.style.margin="0px";
  obj.style.filter = "alpha(opacity:80)";
  obj.style.backgroundcolor = "#00C100";
  obj.style.zIndex = 10000;
  }
x = document.body.scrollLeft + windowWidth()/2 - 250;
y = document.body.scrollTop + 300;
obj.style.left = x + "px";
obj.style.top = y + "px";
obj.style.display="block";
} 

[alecsss]

non va su ie7....

[deleted_110]

Non ho a dispozizione IE7 per fare prove, mi spiace...

pero' mi pare strano (anche se da IE ci si puo' aspettare di tutto...) non riesci a ricavare l'errore che ti da?

[alecsss]

non va nel senso che l'alert popup dovrebbe comparire al centro pagina, trasparente e sovrapposto a tutti gli altri elementi....

Per quanto riguarda l'obiezione di raven il consiglio è ottimo anche se nella pagina l'aert compare una sola volta.

[deleted_110]

Se e' un problema di trasparenza e sovrapposizione allora e' una questione di css.

Anche il posizionamento dipende sia dal js che dai css. Infatti non avendo il resto del documento non lo vedo centrato ne' su FF ne' su IE

Ma se il problema e' IE7 passo la mano ad altri forumisti... al momento ho solo IE6

ciao

[alecsss]

si ma non si potrebbe impostare la trasparenza e la sovrapposizione tramite js?

obj.style.filter = "alpha(opacity:80)";
obj.style.backgroundcolor = "#00C100";
obj.style.zIndex = 10000;

non fanno proprio questo???

[alecsss]

cmq il css è questo...

.transparent {
filter:alpha(opacity=80);
opacity: 0.6;
background-color:#00C100;
display:none;
width:500px;
height:100px;
position:absolute;
color: white;
border-top: 1px #000000 dotted;
border-bottom: 1px #000000 dotted;
font-family: verdana;
font-size: 14px;
font-weight: bold;
z-index: 10000;
text-align: center;
vertical-align: middle;

}

[deleted_110]

Si' mi pare corretto per IE. Invece non so se e' la chiamata giusta per FF. Pero' scusa, perche' la trasparenza la imposti da js? Mettila direttamente nel css, no?

A meno che tu non pensi di mettere una trasparenza variabile da un popup all'altro (e mi sembra improbabile) la metti nel css e sei tranquillo. Fai fare meno roba possibile a js.

Tra l'altro ripeto che FF e IE gestiscono la trasparenza in modo diverso. Lo stesso vale per il colore di sfondo etc... Tanto hai gia' assegnato una classe al tuo div.

Per assurdo il tuo div potresti comunque crearlo in HTML e impostare da css display=none

E poi con js gestisci solo il display e al limite la posizione.

Ti eviti appendchild etc...

IMHO meno codice js si scrive meglio e'