Author Topic: [DE] Hover Effekt mit Bildwechsel / [EN] Hover effect by switching pictures  (Read 1281 times)

tX

  • Newbie
  • *
  • Posts: 1
=========== DEUTSCH ===========
Hallo,

ich möchte gerne eine Lösung für ein bisher nicht vorhandenes Feature näher bringen.

Hover Effekt mit Bildwechsel

Die Idee ist recht simpel und benötigt lediglich das importieren einer SWF-Datei.
Diese SWF-Datei enthält den eigentlichen Effekt bzw. eine Schaltfläche mit Bildwechsel.
Das erstellen einer solchen SWF-Datei wird hier gezeigt:
http://www.tizag.com/flashTutorial/flashbutton.php

Danach wird das ganze einfach in das bestehende "Book" über die XML-Datei eingebunden,
z.B. wie folgt mit der eben erstellten Datei "BUTTON.swf"

Code: [Select]
<page bgcolor="0">
<img left="0" top="0" aa="true">
<src lang="de">path/to/your/pages/de/page001.png</src>
<src lang="en">path/to/your/pages/en/page001.png</src>
</img>
<img left="98" top="308" width="92" height="35" aa="true" src="path/to/your/swf/de/BUTTON.swf" url="anchor:chapter1" title=""></img>

Die Reihenfolge des Einbindens ist hier entscheidend. Was zu erst eingebunden wird
bzw. zuerst geladen, rückt automatisch in den Hintergrund.
Wir sehen in diesem Beispiel ist der Anker "chapter1" verlinkt der einige Seiten später definiert ist:

Code: [Select]
<page bgcolor="0" anchor="chapter1">
<img width="400" height="625" aa="true">
<src lang="de">path/to/your/pages/de/page005.png</src>
<src lang="en">path/to/your/pages/en/page005.png</src>
</img>
</page>

Diese Methode ist sicherlich nicht so sauber wie ein Plugin, jedoch sehr flexibler.
Viel Spaß beim ausprobieren!




=========== ENGLISH ===========
Hi,

I want to bring up a solution for a not implemented feature.

Hover effect by switching pictures

The idea is quite simple and needs only to import a swf file.
The swf file contains the effect, the button with the switching pictures.
Creating a swf file like this you can see here:
http://www.tizag.com/flashTutorial/flashbutton.php

After that it will be implemented over the xml sheet in the already created "book".
For an example the file "BUTTON.swf":

Code: [Select]
<page bgcolor="0">
<img left="0" top="0" aa="true">
<src lang="de">path/to/your/pages/de/page001.png</src>
<src lang="en">path/to/your/pages/en/page001.png</src>
</img>
<img left="98" top="308" width="92" height="35" aa="true" src="path/to/your/swf/de/BUTTON.swf" url="anchor:chapter1" title=""></img>

The order of the files is important. first loaded file turns into the background,
last loaded file always in the foreground.
In this example we see the anchor "chapter1" is linked to an another page some pages later:

Code: [Select]
<page bgcolor="0" anchor="chapter1">
<img width="400" height="625" aa="true">
<src lang="de">path/to/your/pages/de/page005.png</src>
<src lang="en">path/to/your/pages/en/page005.png</src>
</img>
</page>

This method isn't clean as a plugin, but more flexible.
Have fun to play with it!