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:
document.images.name //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
| 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
| 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. |
Examples
onerror
<image src="test.gif" onerror="alert('This image didn\'t download successfully')" />
src
This example creates the classic image rollover effect on an image link:
<a href="http://www.dynamicdrive.com" onMouseover="document.images.logo.src='dd2.gif'" onMouseout="document.images.logo.src='dd.gif'"><img name="logo" src="dd.gif" /></a>
Reference List
- JavaScript Operators
- JavaScript Statements
- Global functions
- JavaScript Events
- Escape Sequences
- Reserved Words
Right column