tatsächlich: das jflip hat ein Kompatibilitätsskript für ältere IEs!
Dann könnte man doch schon gleich ein Plugin draus machen...Zur Nutzung:
- Code: Select all
<link rel="stylesheet" href="style.css">
<!--[if IE]><script type="text/javascript" src="excanvasX.js"></script><![endif]-->
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.jflip-0.4.js"></script>
kommt in den <head> des Templates (am besten immer nach <?php echo head()?> einfügen). Die Dateipfade müssen relativ zum Installationsverzeichnis von CMSimple angegeben werden. Die Zeile mit jquery-1.2.6 lässt Du weg, und setzt im jQuery-Plugin autoload=1. (style.css wird höchst wahrscheinlich gebraucht)
- Code: Select all
<ul id="g1">
<li>
<img src="flower1.jpg" />
</li>
<li>
<img src="flower2.jpg" />
</li>
<li>
<img src="flower3.jpg" />
</li>
<li>
<img src="flower4.jpg" />
</li>
<li>
<img src="flower5.jpg" />
</li>
<li>
<img src="flower6.jpg" />
</li>
</ul>
<div id="l1">Image 1 of 6</div>
kommt auf die gewünschte CMSimple-Seite. Natürlich musst Du Bilder entsprechend anpassen, und ganz unten auch die Gesamtanzahl (und das vielleicht auf Deutsch: Bild 1 von 6). Wichtig ist, dass für die id von ul (erste Zeile) und div (letzte Zeile) eindeutige Bezeichner eingetragen werden, die sonst auf der Seite nicht vorkommen.
Die Aktivierung kannst Du eigentlich auch auf der Seite eintragen (natürlich im HTML-Modus, und unbedingt nach den Bildern):
- Code: Select all
jQuery("#g1").jFlip(300,300,{background:"green",cornersTop:false}).
bind("flip.jflip",function(event,index,total){
$("#l1").html("Image "+(index+1)+" of "+total);
});
Hier ist es wichtig die #g1 und #l1 mit den obigen ids abzustimmen. Ansonsten ggf. die Parameter 300,300 (Breite und Höhe), background und cornersTop anpassen. Und wieder übersetzen (Bild ... von ...)
Wenn ich nichts übersehen habe, müsste das so klappen.
Tipp: wenn Du hier im Forum Code postest, dann am besten auch als Code formatieren, da übersichtlicher. Dazu einfach den Code markieren und auf den entsprechenden Schalter oberhalb des Editors drücken.
Wenn Du Dir die Arbeit mit dem Einfügen der Bilder ersparen willst, kannst Du auch folgendes probieren:
- Jflip_XH-1dev1 runter laden, entzippen und in den Pluginordner hoch laden. Achtung: das ist ein Development-Preview, also schlimmer als ALPHA. Wirklich was kaputt machen kann es nicht, aber es kann sein, dass es gar nicht funktioniert.
- Dann legst Du die Bilder in einem Verzeichnis Deiner Wahl ab (irgendwie so, dass sie bei der Sortierung die richtige Reihenfolge haben; etwa Seite1, Seite2 usw.), z.B. in images/buch/
- Dann gibst Du auf der gewünschten CMSimple-Seite einfach ein:
{{{PLUGIN:jflip('images/buch/');}}} - Dann in den View-Mode schalten; eigentlich sollte es schon funktionieren
- Dann kannst Du in der Konfiguration noch Breite, Höhe und Hintergrundfarbe festlegen
Christoph