Genie Image

The image widget creates an element on your page that displays a graphic file (.gif, .jpg, .png, etc.) from your IFS, database, or elsewhere on the web. The image source (path and name) is required, and can be input as a static value or a dynamically scripted value.

Adding a static image

Select Image from the Common Section inside of Widgets.


Position the image by dragging it with the mouse or arrow keys. You can also input the ‘left’ and ‘top’ measurements into the Position section of the image properties window.

In the image properties window, under the Field Settings section, enter the path and name of the image (either static: ‘http://mysite...etc’ or relative to Genie on the server: ‘/images/myimage.gif…etc’).

Adding a dynamic image

To add a dynamic image with Genie Designer, simply add the new image element from the design toolbar as above, and enter the image source as follows:

js: '/images/' + get('element ID') + '.gif'

(where ‘/images/’ is the HTTP Path (or IFS directory under /www/profoundui/htdocs/) containing your images and ‘element ID’ is the id of an existing on-screen element containing the name of the image.)

Adjusting Image Size and Borders

To adjust these image parameters, simply use the Image Properties window.