Documentation

Zoom Image

Description

The Zoom Image module enables to display two versions of an image. To display a full screen image, simply click on the area in the bottom-right corner of the addon.

Note: To display SVG files in Internet Explorer browsers correctly, you have to add to <svg> tag the following parameter: viewBox="0 0 WIDTH HEIGHT".
For example: <svg width="800" height="400" viewBox="0 0 800 400" ...
You can edit SVG files in any text editor.

Properties

The list starts with the common properties, learn more about them by visiting the Modules description section. The other available properties are described below.

Property name Description
Full Screen image This property enables to insert a full screen image version into the module.
Page image This property enables to insert a page image version into the module.

These properties allow online resources. Find out more ยป

Supported commands

Command name Params Description
... ... ...

CSS classes

Class name Description
.icon indicates the active area in the bottom-right corner
.small indicates the page image version
.zoom-image-wraper indicates the wrapper for full screen image version
.big indicates the full screen image version
.ui-dialog indicates the look of the dialog box
.ui-dialog-titlebar indicates the look of the titlebar
ui-dialog-title-dialog indicates the look of the title
.ui-dialog-titlebar-close indicates the look of the close button
.ui-dialog-content indicates the look of the description container

Demo presentation

Demo presentation contains examples of how to use this addon.