Home > Element Reference : Image

Contents

### Image

An element that displays an image, much like the HTML img element. The src attribute can be used to specify the URL of the image.

More information about image

Example:

        <image src='my-face.png' width='60' height='80'/>

The image element implements the following interfaces:

nsIAccessibleProvider nsIDOMXULImageElement

Attributes:

onerror | onload | src | validate

Style Classes:

alert-icon | error-icon | message-icon | question-icon

Properties and Methods:

accessible | src

#### Attributes:

Inherited from XUL Element:

align
allowevents
allownegativeassertions
class
coalesceduplicatearcs
collapsed
container
containment
context
contextmenu
datasources
dir
empty
equalsize
flags
flex
height
hidden
id
insertafter
insertbefore
left
maxheight
maxwidth
menu
minheight
minwidth
mousethrough
observes
ordinal
orient
pack
persist
popup
position
preference-editable
ref
removeelement
sortDirection
sortResource
sortResource2
statustext
style
template
tooltip
tooltiptext
top
uri
wait-cursor
width

##### onerror

Type: script code

This event is sent to an image element when an error occurs loading the image.

##### onload

Type: script code

This event handler will be called on the image element when the image has finished loading. This applies whether the image is applied via the src attribute or the list-style-image style property. If you change the image, the event will fire again when the new image loads. This event will not bubble up the element tree.

##### src

Type: image URL

The URL of the image to appear on the image. If this attribute is left out, no image appears.

##### validate

Type: one of the values below

This attribute indicates whether to load the image from the cache or not. This would be useful if the images are stored remotely or you plan on swapping the image frequently. The following values are accepted, or leave out the attribute entirely for default handling:

- always: The image is always checked to see whether it should be reloaded.
- never: The image will be loaded from the cache if possible.

#### Style Classes:

The following classes may be used to style the element. These classes should be used instead of changing the style of the element directly since they will fit more naturally with the user's selected theme.

##### alert-icon

Class that adds an alert icon. This typically looks like an exclamation mark. This and the other icon classes may be used by image elements or other elements which can have an image.

##### error-icon

Class that adds a error icon. This will typically be a red X icon.

##### message-icon

Class that adds a message box icon.

##### question-icon

Class that adds a question icon, which usually looks like a question mark.

#### Properties and Methods:

##### accessible

Type: nsIAccessible

Returns the accessibility object for the image.

##### src

Type: image URL

Gets and sets the value of the src attribute.

Inherited from XUL Element:

align | allowEvents | blur | boxObject | boxObject.element
boxObject.getLookAndFeelMetric | boxObject.height | boxObject.screenX | boxObject.screenY | boxObject.width
boxObject.x | boxObject.y | builder | className | click
collapsed | contextMenu | controllers | database | datasources
dir | doCommand | flex | focus | getElementsByAttribute
height | hidden | id | left | maxHeight
maxWidth | menu | minHeight | minWidth | observes
ordinal | orient | pack | persist | ref
resource | statusText | style | tooltip | tooltipText
top | width

Inherited from Element:

addEventListener | appendChild | attributes | childNodes | cloneNode
dispatchEvent | firstChild | getAttribute | getAttributeNS | getAttributeNode
getAttributeNodeNS | getElementsByTagName | getElementsByTagNameNS | hasAttribute | hasAttributeNS
hasAttributes | hasChildNodes | insertBefore | isSupported | lastChild
localName | namespaceURI | nextSibling | nodeName | nodeType
nodeValue | normalize | ownerDocument | parentNode | prefix
previousSibling | removeAttribute | removeAttributeNS | removeAttributeNode | removeChild
removeEventListener | replaceChild | setAttribute | setAttributeNS | setAttributeNode
setAttributeNodeNS | tagName

Copyright (C) 1999 - 2004 XulPlanet.com