magnifier |
circle |
circle|square|inner|custom(x1,y1,x2,y2,..) |
Magnifier shape |
magnifier-size |
66% |
Numeric or % |
Magnifier size: % of small image width or fixed size in px |
magnifier-size-x |
66% |
Numeric or % |
Magnifier width: % of small image width or fixed size in px |
magnifier-size-y |
66% |
Numeric or % |
Magnifier height: % of small image width or fixed size in px |
magnifier-effect |
fade |
none|pulse|fade |
Magnifier appearing effect |
magnifier-filter |
glow |
glow|shadow |
Magnifier effect |
magnifier-time |
200 |
milliseconds |
Time for magnifier effect |
magnifier-simulate |
false |
% ('false'=off) |
Create enlarged images from small ones with specified scale |
magnifier-border-color |
#CCCCCC |
|
Magnifier border color |
magnifier-border-width |
1 |
px |
Magnifier border thickness |
border-color |
#CCCCCC |
|
Outside border color |
border-width |
0 |
Numeric, px |
Outside border width |
progress-color |
#CCCCCC |
|
Color of the loading bar |
progress-height |
0 |
Numeric, px |
Height of the loading bar |
wheel-effect |
20% |
0-100% |
Wheel effect for changing magnifier size |
lense-url |
|
|
Custom image URL |
lense-offset-x |
0 |
Numeric, px |
Custom image x-offset |
lense-offset-y |
0 |
Numeric, px |
Custom image y-offset |
lense-position |
top |
top|bottom |
Custom image position |
disable-auto-start |
false |
true|false |
Disable magnify effect until clicked |
blur |
0 |
Numeric, px |
Blur effect of the main image when magnifier is shown |
transparency |
100% |
0-100% |
Transparency of the main image when magnifier is shown |
hide-cursor |
false |
true|false |
Hide mouse pointer |
callback |
|
|
JavaScript function name for mouse click callback |
Thumbnails |
thumb-change |
click |
click|mouseover |
Method to switch between multiple images |
thumb-change-delay |
200 |
milliseconds |
Delay before switching images |
thumb-change-time |
500 |
milliseconds |
Speed of changing size of multiple images |
change-time |
500 |
milliseconds |
Speed of changing opacity of multiple images |
Enlarger |
expand-speed |
500 |
0-10000 |
Expand duration (ms) |
restore-speed |
|
0-10000 |
Restore duration (ms), optional |
expand-effect |
linear |
linear / cubic / back / elastic / bounce |
Effect for expanding image |
restore-effect |
auto |
auto / linear / cubic / back / elastic / bounce |
Effect for restoring image |
restore-trigger |
auto |
auto / click / mouseout |
Trigger to restore image to its small state |
expand-align |
screen |
screen / image |
Align image relative to screen or small image |
expand-position |
center |
center / coordinates examples: top:0, right:25 or bottom:100, left:100 |
Precise position of enlarged image (px) |
image-size |
fit-screen |
fit-screen / original |
Size of the enlarged image |
keep-thumbnail |
false |
true / false |
Show/hide thumbnail when image enlarged |
background-color |
#000000 |
|
Background color behind large image |
background-opacity |
0 |
0-100 |
Opacity of the background, 0 = disabled |
background-speed |
200 |
0-10000 |
Duration of background fade (ms) |
caption-source |
span |
span / img:alt / img:title / a:title / #id |
Source of caption text |
caption-speed |
250 |
0-10000 |
Speed of caption slide effect (ms) |
caption-position |
bottom |
bottom / right / left |
Where to position the caption |
caption-height |
300 |
|
Max height of bottom caption (px) |
caption-width |
300 |
|
Max width of left/right caption (px) |
buttons |
show |
show / hide / autohide |
Whether or not to show buttons |
buttons-position |
auto |
auto / top left / top right / bottom left / bottom right |
Corner position of buttons |
buttons-display |
previous, next, close |
previous / next / close |
Show all three buttons or just one or two |
slideshow-effect |
dissolve |
dissolve / fade / expand |
Slideshow effect to move between large images |
slideshow-speed |
500 |
0-10000 |
Speed of slideshow effect (ms) |
slideshow-loop |
true |
true / false |
Restart slideshow after last image |
link |
|
http://www.example.com |
Link enlarged image to a URL |
link-target |
_self |
_blank / _self / _parent / _top |
Open link in browser window/frame |
keyboard |
true |
true / false |
Ability to use keyboard shortcuts |
keyboard-ctrl |
false |
true / false |
Require the Ctrl key to permit shortcuts |
disable-expand |
false |
true|false |
Disable/Enable expand effect |
z-index |
10001 |
|
The z-index for the enlarged image |
css-class |
|
any name |
Apply different styles to different images |