JavaScript Kit > JavaScript Reference > Here

Image Object

Last updated: March 17th, 2005

Images on the page are represented by the Image object in JavaScript. They can be accessed using the syntax: //access image by its name
document.images[i] //access image by its position within array
document.images.length //returns total number of images

You can define an image on the fly using the Image Constructor function:

new Image([width], [height])

where "width" and "height" are optional.

Related Tutorials


Events Description
onabort Code is executed when user aborts the downloading of the image.
onerror Code is executed when an error occurs with the loading of the image (ie: not found). Example(s)
onload Code is executed when the image successfully and completely downloads.


Properties Description
border Integer that specifies the border width of the image, in pixels.
complete Boolean that specifies whether the image has loaded completely (successful or not).
fileSize Returns the file size of the specified image on the page. In IE Windows, a numeric string is returned, while in IE Mac, a number instead. Use it on any image or a loop to cover all images on the page. IE only property.
height The height of the image.
hspace Reflects the "hspace" attribute.
lowsrc Reflects the "lowsrc" attribute.
name The name of the image as assigned by the "name" attribute.
src A read/write string specifying the URL of the image. Example(s).
vspace Reflects the "vspace" attribute.
width The width of the image.



<image src="test.gif" onerror="alert('This image didn\'t download successfully')" />


This example creates the classic image rollover effect on an image link:

<a href="" onMouseover="document.images.logo.src='dd2.gif'" onMouseout="document.images.logo.src='dd.gif'"><img name="logo" src="dd.gif" /></a>

Reference List

Right column

CopyRight (c) 2018 JavaScript Kit. NO PART may be reproduced without author's permission. Contact Info