Originariamente inviato da artorius
allora, qui trovi gli attributi e gli eventi dell'oggetto Image:
http://www.comptechdoc.org/independe...javaimage.html
Vedi l'oggetto come un canale tramite il quale il browser carica un'immagine da un determinato url, senza dover caricare una nuova pagina.
l'oggetto funziona in questo modo:
Codice PHP:
//Con questo istanzi, ovvero crei, un oggetto della classe Image
var img = new Image();
//L'evento onLoad viene lanciato quando l'immagine indicata viene caricata correttamente, come a tutti gli eventi, è possibile associarci una funzione che viene chiamata al verificarsi dell'evento
img.onload = function(){
myFunct();
}
//L'evento onError, come dice il nome, viene lanciato se si verifica un errore
img.onError = function(){ alert("Non è stato possibile caricare l'immagine")}
//Indicando nell'attributo src il path dell'immagine, si attiva il processo di download della stessa. Quando l'immagine viene caricata l'evento onLoad viene lanciato, se si verifica un errore viene lanciato l'evento onError (N.B. C'è anche l'evento onAbort che viene lanciato se il caricamento viene annullato)
img.src = "path/to/image.jpg";
function myFunct()
{
//gli oggetti Image, una volta caricata l'immagine, hanno a disposizione le proprietà width e height che contengono le dimensioni della stessa in pixel
alert(img.width+"px X "+img.height+"px");
}
La cosa più importante da capire è che il caricamento dell'immagine in questo modo è asincrono, cioé non necessita di bloccare JS o il caricamento della pagina per funzionare.
Appunto per questo è utile in azioni come, il caricamento di immagini pesanti, o da server diversi, il browser le processa in parallelo chiamando le funzioni associate agli eventi quando sono pronti.
Spero che la mia mini guida ti sia utile.
