Class UFRollOverImage

UFRollOverImage can be used to update one or more images when the user mouse-overs an element.

It is also possible to specify a UFModel instance to track a boolean property of. When false the class will show a disabled image and ignore mouse-over events.

An should define data-uf-over (and optionally data-uf-disabled) containing urls to images for roll over and disabled state.

Example

<img
  src="flag-normal.png"
  data-uf-over="flag-over.png"
  data-uf-disabled="flag-disabled.png"
  ...
/>

Constructors

constructor

Methods

destroy

Constructors

constructor

  • new UFRollOverImage(
        anElement: string | HTMLElement,
        anExtraImages?: (string | HTMLImageElement)[],
        aData?: UFModel,
        aPropertyName?: string,
    ): UFRollOverImage

    Constructs an instance of UFRollOverImage

    Parameters

    • anElement: string | HTMLElement

      DOM element to check for roll over events. This can be an or another type. In the latter case the class will process all child image elements.

    • anExtraImages: (string | HTMLImageElement)[] = []

      Array of additional images elements to update

    • OptionalaData: UFModel

      An instance extending UFModel, when specified this class will update the visual disabled state of all images. While disabled the mouse-over events will not change the visual state.

    • aPropertyName: string = 'enabled'

      The property name to track (if aData is not null). Default is 'enabled'.

    Returns UFRollOverImage

Methods

destroy

Settings

Member Visibility

On This Page

Constructors
Methods