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.
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.