Obiekt Image

Składnia:

zmienna = new Image();

Obiekt Image służy do przechowywania informacji dotyczących pliku graficznego.
Najczęściej, obiekt taki wykorzystujemy, gdy zamierzamy stworzyć efekt typu rollover tzn. obrazek zmienia się gdy najeżdżamy na niego myszką.

Na przykład:
w skrypcie w sekcji <HEAD> piszemy

var image1= new Image();
var image2= new Image();
image1.src = "sciezka/plik1.gif";
image2.src = "sciezka/plik2.gif";

a w sekcji <BODY> piszemy

<A HREF="#"
onMouseOver="document.images.obrazek.src=image2.src"
onMouseOut="document.images.obrazek.src=image1.src">
<IMG NAME="obrazek" SRC="sciezka/plik1.gif"></A>

Gdybyśmy nie użyli obiektu Image, a przy definiowaniu obsługi zdarzenia napisali

onMouseOver= "document.images.obrazek.src='sciezka/plik2.gif';"

to ładowanie pliku graficznego plik2.gif, rozpoczęło by się dopiero po najechaniu myszką na obrazek. Natomiast w przypadku zastosowania obiektu Image, plik graficzny został załadowany w momencie ładowania się całego dokumentu (preloading), tak że po najechaniu kursorem na obrazek, zmiana grafiki następuje bez opóźnienia.

Właściwości obiektu Image

zmiennaImage.src

Ścieżka dostępu do pliku graficznego.


zmiennaImage.width

Szerokość grafiki w pikselach.


zmiennaImage.height

Wysokość grafiki w pikselach.


zmiennaImage.complete

Właściwość mówi nam czy grafika została już załadowana. Osiąga wartość true (prawda) lub false (fałsz).