TOOLBAR HOVER EXAMPLE


The toolbar in this display uses the HTML parameter zToolbarBackgroundVisible to hide the toolbar background graphic and create the effect of a hovering toolbar - with buttons floating over the Zoomify Image.

Note that this effect is enhanced by using sharp corners to avoid distorted buttons. A superior solution is to use PNG button graphics - the PNG format supports transparency and therefore provides for smoother button edges.

To choose from a large selection of such skins see the Destiny Skins on the Zoomify website. Destiny Skins are extremely inexpensive and can be implemented by simply downloading a new 'Default' folder and copying it into your 'Assets' folder - no HTML editing required! (Simple how-to steps are included in the download.)

And of course it is a simple matter to create your own set of button graphics. Each button only requires three image files - for example, the Zoom In button uses the files zoomInUp.png, zoomInOver.png, and zoomInDown.png files to show interaction as the user places the mouse over the button or presses the button.

Lastly, note that this example also uses the HTML parameters zLogoVisible=0 and zMinimizeVisible=0 to hide buttons that are positioned to the far left of the Toolbar. Hiding these creates a cleaner presentation.