Parameters

If you would like to use global parameters for all images displayed with FSI TouchZoom, the corresponding parameters can be defined in the _default.xml.


Example:
<fsi_parameter>
	<Image>
		<ServerType value="FSI"/>
	</Image>


	<TouchZoom>
		<useDevicePixelRatio value="true" />
		<enableByCSSClass value="zoom-image" />
		<zoomPrecision value="3" />
	</TouchZoom>
...

<Options>
	<Skin value="black"/>
	<FSIBase value="config/"/>
	<Language value="english"/>
	<ScenePreload value="true"/>
</Options>

</fsi_parameter>


You can optionally modify the way FSI TouchZoom works by passing parameters to the script. To do so, pass an object containing the parameters and value as an object to the constructor:



Example:
<script type="text/javascript">
FSITouchZoom = new $FSI.TouchZoom({debug:true, zoomPrecision:6});
FSITouchZoom.init();
</script>


debug

Descriptiondisplays debug & status information in the javascript console.
SyntaxBoolean
Defaultfalse
ContextFSI TouchZoom

Display debug and status information in the browser's javascript console.




format

Descriptiondefines the format used for the viewer.
SyntaxBoolean
Defaultfalse
ContextFSI TouchZoom

Defines the format used for the viewer.
Default is auto which automatically chooses the best format depending on the browser; alternatively you can choose WEBP, JPEG, PNG or GIF.
Auto delivers the images adaptively as WEBP in supporting browsers, and switches to PNG or JPEG on unsupporting browsers.
If you set WEBP as a format, please keep in mind that certain browsers (currently Safari and Internet Explorer) do not support the format and will not show the image.
If you would like to use WEBP, the best way would be to set auto as the format.



useDevicePixelRatio

DescriptionUse the device's pixel ratio to display even sharper images.
SyntaxBoolean
Defaulttrue
ContextFSI TouchZoom


Use the device's pixel ratio to display even sharper images. For devices with a pixel ratio >1 (e.g. Apple iPad 3) the images will be displayed in higher resolutions. If the aspect ratio is 2, the images loaded when pinching a page will be 2 x the resolution compared to devices with a pixel aspect ratio of 1.




monitorPositions

DescriptionThe script monitors the position of all single source <img> tags
SyntaxBoolean
Defaulttrue
ContextFSI TouchZoom


By default the script monitors the position of all single source <img> tags to ensure that a higher resolution image will be loaded if the image is within the viewport. For huge amounts of images on a single web page you might want to disable this feature, if the positions of the images do not change (e.g. there is no javascript modifying the DOM tree).




useTiledImages

DescriptionZoomed images will be tiled into multiple image tiles
SyntaxBoolean
Defaulttrue
ContextFSI TouchZoom


By default, zoomed images of 1000 pixel in width or height will be tiled into multiple image tiles. While this increases the user experience and the loading performance, you might want to disable this feature if you e.g. change the style of an image (e.g. style.display) at runtime. In this case the change would not effect the tiled image.





zoomPrecision

DescriptionThis parameter defines the precision of loading zoomed images.
SyntaxInteger
Default4
ContextFSI TouchZoom


This parameter defines the precision of loading zoomed images.

Using the value "0" will load images exactly matching the current magnification. This does on the other hand prevent effective caching.

Values greater than 0 increase the precision how often the script loads new images when changing the magnification. The value 4 means that the script loads new images at 1.0, 1.25, 1.5, 1.75, 2.0 etc. magnification levels.




loadingImage

DescriptionSpecifies which image to display at the bottom right of the viewport
SyntaxBoolean or URL
Defaulttrue
ContextFSI TouchZoom


Specifies whether or which image to display at the bottom right of the viewport while new images are being retrieved from FSI Server. You can use true or false to enable/disable the loading image display or provide an URL to a custom image.




imgSrcAttributeName

DescriptionSpecifies an alternative image source attribute
Syntaxstring
Default-
ContextFSI TouchZoom


Specifies an alternative image source attribute if required. This is useful for example if your would like to have SEO optimized image URLs in the "src" attribute, which would lead to FSI TouchZoom not recognizing the image. In this case, you can add an alternative image src attribute which contains the FSI Server single source image URL.




enableByCSSClass

Descriptionprovides a comma separated list of CSS class names
SyntaxString
Default""
ContextFSI TouchZoom


Using the enableByCSSClass parameter you can provide a comma separated list of CSS class names. Only images containing at least one of the given class names will be modified by this script. All other images normal images that do not increase the resolution dynamically.

You can combine this parameter with the disableByCSSClass parameter.




disableByCSSClass

Descriptionprovides a comma separated list of CSS class names
SyntaxString
Default""
ContextFSI TouchZoom


Using the disableByCSSClass parameter you can provide a comma separated list of CSS class names. Images containing at least one of the given class names will NOT be modified by this script. All other images containing single source image URLs will be modified.

You can combine this parameter with the enableByCSSClass parameter.