Zoom: Konfiguration

Die Zoom-Funktion kann den Bedürfnissen angepasst werden. Der Folgende Code darf irgendwo auf der Seite nach dem Include von zoom.js, aber muss vor ZoomInit() stehen.

In den Beispielen werden die Werte gesetzt, die als Standard einprogrammiert sind. Du kannst alle jene Zeilen einfach weglassen, wo du die Standardwerte verwenden willst.

Alternativ kannst du auch direkt die Werte in der Datei zoom.js manipulieren, damit sich die gemachten Änderungen auf alle Seiten mit der Zoom-Funktion auswirken.

Zoom Verhalten

<script type="text/javascript">
Zoom.EnableDblClick = true;
Zoom.NewWindowOnDblClick = false;
Zoom.ZoomWindowName = 'Zoom';
Zoom.ZoomWindowFeatures = ''; // e.g: 'innerWidth=%w, innerHeight=%h';

Zoom.BorderColor = 'black';
Zoom.BorderWidth = 1;
Zoom.ZIndex = 100; // z-index des Zoom-Bildes
Zoom.TimeSpan = 500;
Zoom.TimerInterval = 40; // 40 ms = 25 fps (frames per second)
Zoom.HideSmall = false; // to hide small image during zoom
Zoom.AddPosX = 1; // Offset zur Startposition des Zoom-Bildes
Zoom.AddPosY = 1;
</script>

EnableDblClick

Mit dem Wert false wird das Öffnen des Zoombildes in einem eigenen Fenster beim Doppelklick auf die Vorschau deaktiviert.

NewWindowOnDblClick

Wenn dieser Wert false ist, wird das Zoom-Bild bei einem Doppelklick auf die Vorschau im gleichen Fenster angezeigt (nur das Bild alleine). Wenn dieser Wert true ist, wird das Zoom-Bild in einem neuen Fenster angezeigt. Mit ZoomWindowName und ZommWindowFeatures können Name und weitere Einstellungen des Fensters festgelegt werden.

ZoomWindowName

Name, den das neue Zoom-Fenster intern erhalten soll. Mit dem HTML-Attribut target kann in A-Tags auf diesen Namen verwiesen werden.

ZoomWindowFeatures

Legt fest, ob Toolbar, Scrollbar usw. im neuen Fenster angezeigt werden sollen oder nicht. Siehe JavaScript-Referenz der Funktion window.open() für eine Beschreibung der Features. Mit %w und %h kann auf die Breite und Höhe des Zoom-Bildes zugegriffen werden: ZoomWindowFeatures = 'width=%w, height=%h.

BorderColor, BorderWidth

Mit BorderColor und BorderWidth kann der Rahmen um das Zoombild eingestellt werden. Ein BorderWidth von 0 bedeutet: keinen Rahmen.

ZIndex

ZIndex gibt die Z-Ebene an, auf der das Zoombild angezeigt wird. Der Wert sollte der höchste verwendete Wert von allen Elementen auf der Seite sein, damit das Zoombild nicht von anderen Elementen verdeckt wird.

TimeSpan, TimerInterval

Mit TimeSpan wird in Millisekunden angegeben, wie lange der Zoomvorgang dauern soll. Mit TimerInterval wird die zeitliche Auflösung des Zoomvorgangs eingestellt. Ein Wert von 40 ms ergibt 25 Bewegungen pro Sekunde, was fliessend genug ist, sofern der Computer genug Leistung dafür hat.

HideSmall

Mit HideSmall kann eingestellt werden, ob das Vorschaubild während dem Zoomvorgang ausgeblendet werden soll (true).

Automatischer Preload

Standardmässig sucht sich die Zoom-Funktion alle Aufrufe von ZoomIn() auf der HTML-Seite und sammelt die dort angegebenen URL's zu den Zoom-Bildern. Diese Zoom-Bilder werden intern im Hintergrund in den Browser heruntergeladen, damit sie schnell zur Verfügung stehen, wenn sie gebraucht werden.

Die Zoom-Bilder können jedoch auch explizit zum Vorausladen bei der Funktion ZoomInit() angegeben werden. Das automatische Preload kann dann wiefolgt deaktiviert werden:

Zoom.AutoPreload = false;
ZoomInit( 'ZoomUrl1', 'ZoomUrl2', 'ZoomUrl3', ... );

Der Auto-Preload und das explizite Preload können auch beide gleichzeitig verwendet werden. Die Zoom-Funktion (bzw. der Image-Cache) ist intelligent genug, jedes Bild nur einmal herunter zu laden, auch wenn es mehrfach angegeben wird.