Come mai a volte mi da "width=0"

[Donovant]

Salve ho creato una gallery, in cui l'immagine viene caricata al "volo" in un div->img, anche loro creati al volo. Il problema è che quando l'immagine appare a volte mi viene data "width" uguale a ZERO, ma l'immagine viene caricata correttamente (tutta), ma il "width" in questione mi serve per centrarla, e se mi da ZERO, va in errore e la mette dove gli pare a lui (il PC credo) ^_^.

Di seguito la parte di codice in esame:

velo_photo = new Element("div",{styles:{ "height":$("fx_content").getStyle("height").toInt()+"px", "opacity":"0" },
								   id:"velo_photo"			  
	}).addEvent("click", function(){ $("box_photo").fade(0); $("velo_photo").fade(0); }
	
	);
	box_photo = new Element("div",{styles:{ "height":$("fx_content").getStyle("height").toInt()+"px", "opacity":"0", "border":"1px solid red" },
								   id:"box_photo"			  
	});
	
	img_photo = new Element("img",{
						src:"gallerie/"+arrPics[indImg]["idg"]+"/"+arrPics[indImg]["path"], 	
				   styles:{},
				   id:"photo"
	});
	
	
	velo_photo.inject($("fx_content"));
	box_photo.inject($("fx_content"));
	img_photo.inject(box_photo);
	
	box_photo.setStyle("margin-left", (($("fx_content").getStyle("width").toInt() - img_photo.getStyle("width").toInt() )/2)+"px");

[Xinod]

non attendi che l' immagine sia completamente caricata

[Donovant]

E come dovrei fare? Come faccio a sapere quando le immagini sono caricate completamente?
Grazie.

[Donovant]

Ah, cmq volevo dire che fino ad ora l'ho provato in locale, quindi il caricamento dovrebbe essere più veloce...immagino online
Però se l'immagine non è completamente caricata come mai me la fa vedere (tutta)?

[Vindav]

prova cosi:

var img_photo = Asset.image(pathImage, {
    id: 'photo',
    onLoad:function(){
      //imposto lo stile
    }
});

[Donovant]

Si stavo vedendo come funziona il metodo...ma per ora con scarsi successi....vedremo.

[Donovant]

Risolto:

$$(".pics").each(function(el, jj){
				var loadImg = Asset.image("gallerie/"+arrPics[0]["idg"]+"/mini/"+arrPics[jj]["path"], {
						id: "img"+((pag-1)*$$(".pics").length + jj),
						title: "foto"+((pag-1)*$$(".pics").length + (jj + 1))+" di "+numPics,
						onLoad:function(){
							img = $$(".pics")[jj].getChildren("img")[0];
							img.set("id", ((pag-1)*$$(".pics").length + jj) );
							img.set("title", "foto"+((pag-1)*$$(".pics").length + (jj + 1))+" di "+numPics );
							img.set("src", "gallerie/"+arrPics[0]["idg"]+"/mini/"+arrPics[jj]["path"] );
							margin_align = ( $$(".pics")[0].getStyle("width").toInt() - img.getStyle("width").toInt() )/2;
							margin_align = (margin_align > 0)? margin_align : 0;
							img.setStyles({"margin-left":margin_align+"px"});
							$$(".pics")[jj].fade(1);
							//alert(this.get("width")+" . "+nphoto_width );
							nphoto_width += "foto("+(jj+1)+"): "+this.get("width")+"px width
";
							$("log").set("html",nphoto_width);
						}
				});//Asset.image
			});//EACH

Ora sembra funzionare....grazie.