Image element displays an image within customizable container. Element popup contains following options;

Defaults tab

1. Select Image  -  Select or upload an image.
2. Image size  -  Select the image size to be used.
3. Image grayscale  -  Add grayscale effect.
4. Container metrics  -  Add custom class or ID to HTML container and adjust visibility on specific devices.

Actions tab

1. Click action  -  Select image click action. Open a link or the image in lightbox.
2. Swap image  -  Swap image with another image on hover or once in view.

Container tab

1. Container height  -  Set image container height.
2. Container width  -  Set image container width.
3. Container alignment  -  Set image container alignment. Left right or centered.
4. Container box style  -  Adjust .thz-media-image-container box style.
5. Animate container  -  Add animation to the media HTML container.

Lightbox tab

1. Backdrop Style  -  Select backdrop ( popup background ) style.
2. Backdrop Opacity  -  Set backdrop ( popup background ) opacity.
3. Popup effect  -  Select popup window opening effect.

Overlay tab

1. Overlay display mode  -  Select overlay display mode.
2. Image overlay background  -  Set image overlay background.
3. Image overlay effect  -  Select image overlay hover effect and duration.
4. Image effect  -  Select image hover effect and duration.
5. Overlay icon effect  -  Select image overlay icon hover effect and duration.
6. Image overlay distance  -  Distance the image overlay from image box edges.

Overlay icon tab

1. Show overlay icon  -  Show/hide overlay icon.
2. Overlay icon  -  Set overlay icon. Shown only if icon selected.
3. Icon metrics  -  Adjust icon metrics.
4. Shape metrics  -  Adjust icon background shape metrics.

Effects tab

1. Animate container  -  Add animation to the image HTML container.
2. Container parallax  -  Activate/deactivate container parallax.
3. Media parallax  -  Activate/deactivate media parallax. This effect does NOT work if media height is auto.