[Tutorial] Zoommodus (DE)

[Florian Nücke]

Zoommodus

MegaZine 3 bietet einen eingebauten Zoommodus für Bilder (img Elemente). Das bedeuted, dass es möglich ist eine URL zu einem anderen Bild oder SWF anzugeben welches dann durch den Benutzer geöffnet werden kann. Desweiteren können Bilder im Zoommodus Galerien bilden - die Bilder einer Galerie können durchgeblättert werden ohne den Zoommodus zu verlassen.


Einrichtung eines zoombaren Bildes

Um eine hochauflösende Variante eines Bildes anzugeben verwenden Sie das 'hires' Attribut:

Code: (xml)

<img src="ein/bild.jpg" hires="ein/bild_grosz.png"/>

Falls das hires Attribut eines Bildelements gesetzt ist öffnet ein Klick auf das Bild den Zoommodus. Das so geöffnete, durch 'hires' festgelegte Bild kann natürlich jedes beliebige Bild sein, aber um eine intuitive Bedienung zu gewährleisten wird empfohlen eine Grafik zu verwenden die entweder eine Gesamtversion des Bildes auf der Seite darstellt (d.h. das Bild auf der Seite war ein Ausschnitt der gezoomten Variante), oder dass es sich um dasselbe Bild, nur in einer höheren Auflösung handelt.


Verlinkte Bilder / Positionierung des Zoomicons

Normalerweise öffnet ein Klick irgendwo auf dem Bild den Zoommodus. Zusätzlich wird ein kleines Zoomicon über dem Bild eingeblendet, welches per Standard in der unteren rechten Ecke des Bildes wohnt. Es wird standardgemäß angezeigt um dem Benutzer einen Hinweis zu geben welche Bilder zoombar sind und welche nicht, ohne dass er mit der Maus über die Bilder fahren muss. Die Schaltfläche lässt sich verstecken indem man das 'showbutton' Attribut auf "false" setzt. Wenn das Bild jedoch verlinkt ist (d.h. das url Attribut ist gesetzt) kann das Zoomicon nicht ausgeblendet werden, da es dann die einzige Möglichkeit ist den Zoommodus zu öffnen. Ein Klick auf das Bild öffnet dann den Link.

Das Zoomicon kann frei auf dem Bild positioniert werden (z.B. um zu vermeiden dass sich die Schaltfläche nicht in einem "unklickbaren" Bereich befindet, wie etwa dem Rand der Seiten in dem das Blättern ausgelöst wird). Hierfür kann das 'iconpos' Attribut verwendet werden, etwa so:

Code: (xml)

<img src="ein/bild.jpg" hires="ein/bild_grosz.png" iconpos="top left"/>

Pixelgenaue Positionierung ist auch möglich, hierzu müssen dann die x und y Koordinaten angegeben werden (werfen Sie einen Blick in die Dokumentation für mehr Information dazu).


Erstellen einer Galerie

Bilder können Galerien bilden, also Sammlungen von Bildern die im Zoommodus durchgewechselt werden können. Das hierfür zuständig Attribut heißt 'gallery'. Um zwei Bilder in dieselbe Galerie zu packen muss ihnen einfach derselbe Galeriename zugewiesen werden:

Code: (xml)

<img src="bild1.jpg" hires="bild1g.jpg" gallery="meineGalerie"/>
<img src="bild2.jpg" hires="bild2g.jpg" gallery="meineGalerie"/>

Auf diesem Wege können beliebig viele Galerien erzeugt werden.


Eine Anmerkung zum Vollbildmodus

In den Grundeinstellungen wird beim öffnen des Zoommodus' auch der Vollbildmodus aktiviert, um eine größere Anzeigefläche zur Verfügung zu stellen. Dieses Verhalten kann durch das Setzen des 'zoomfs' Attributs im book Element geändert werden. Um das öffnen des Vollbildmodus' zu deaktivieren:

Code: (xml)

<book zoomfs="false">

Falls der Benutzer vorher jedoch manuell den Vollbildmodus aktiviert hat wird dennoch der ganze Bildschirm genutzt wenn der Zoommodus aktiv wird.


Verlinkte Bilder im Zoommodus

Es gab einige Anfragen ob es möglich wäre Bilder im Zoommodus zu verlinken. Es folgt eine kurze Erklärung warum dieses Feature nicht implementiert werden wird, aber auch ein "Workaround" angeboten, wenn es denn unbedingt sein muss.
Warum nicht: extrem unintuitives Verhalten. Eines der Hauptziele von MegaZine 3 ist eine intuitive Benutzung zu ermöglichen. Nehmen wir nun aber mal folgendes an: im Zoommodus wird der sichtbare Ausschnitt durch klicken und ziehen auf der Bildfläche verschoben wenn das Bild nicht komplett in den Anzeigebereich passt. Wenn es nun komplett reinpasst löst ein Klick auf einmal einen Link aus, und schließt dadurch (sofern offen) auch noch den Vollbildmodus. Das ist alles andere als intuitiv.

Wie es trotzdem geht: Benutzen Sie ein SWF als Zoomvariante und lassen sie dieses SWF Klicks durch das öffnen eines Links behandeln.