Home -> FPP plugins page -> zoomer.swf
This plugin is completely free for use in any context or connection.
FPP hotspot plugin for displaying a panorama zoom component
The following attributes are supported:

zoomRangezoomRange="0.8-2.5"zoom range, default=0.4-3.0
trackImagetrackImage="img/zoomer.png"zoom track image
handleImagehandleImage="img/handle.png"zoom handle image
dragCoordsdragCoords="3;174-3;24"zoom handle drag endpoint coordinates


If you want to design your own zoomer, this is how it works:

The zoomer consists of two images - the scale and the moving handle. The images have their registration point in the upper left corner. And the handle can be moved over the scale image between the two endpoints given in the dragCoords attribute.

The size of the plugin will normally be the size of the scale image, with the coordinates 0;0 in the upper left corner and the coordinates hsize-1;vsize-1 in the lower right corner. So, setting the attribute dragCoords="3;174-3;24" in your hotspot, means that the handle can move between a point at 3;174 (zoomed out) and a point at 3;24 (zoomed in). And as the points have the same x-coordinate, it of course means that this is a vertical scale.

The plugin also captures mouse-down events on the part of the scale image below and above the handle endpoints, which makes them function as zoom in/out buttons.

If the height of the track image is greater than its width, the plugin will work in vertical mode, else it will adjust itself to the horizontal mode.

If the zoom range is specified with the larger value first, i.e. zoomRange="2.8-0.5", the direction of the slider will be inverted. This of course means that the lower or left slider position will be at maximum zoom-in.

Example FPP xml file:


      <spot id="myZoomer" url="zoomer.swf" 
         static="1" salign="BL" align="BL" staticX="15" staticY="-17"
         visible="1" shadow="1" depth="20"
         mouseChildren="1" blockMouse="1" disableKeys="0" disableControls="0"
         onOver="pano.disableWheel=1; pano.disableKeys=1" 
         onOut="pano.disableWheel=0; pano.disableKeys=0"