Wer hätte gedacht, dass es bereits zig verschiedene Lösungen zum Thema Lightbox (Website wird kurzzeitig überlagert durch eine weitere Ebene mit Inhalten, wie z.B. Detailansicht eines Fotos) gibt? Ich jedenfalls nicht, bevor ich den Artikel “
Web 2.0 Round up Modal Window Lightbox Effect Libraries” von Komang a.k.a chazzuka gelesen hatte.
Ich hatte eigentlich gerade Tante Google mit dem Suchquery “modalWindow actionscript” gefüttert, um Näheres über diese offenbar un- oder schlecht dokumentierte Eigenschaft der Window-Klasse herauszufinden. Es kommt nämlich immer häufiger vor, dass sich Kunden eine Art Lightbox-Funktion auch in Flash-Websites wünschen. Obwohl es mit ActionScript natürlich massig Möglichkeiten gibt, so etwas umzusetzen, wollte ich im Zuge meiner Reise durch die Wunderwelt der Flash-Komponenten mal nachschauen, ob es da nicht auch etwas Passendes gibt.
Und siehe da: Es gibt so etwas. Meines Erachtens ist es recht einfach möglich, die in Flash verfügbaren so genannten
modalen Fenster für eine Lightbox-Funktion zu benutzen. Das denke und weiß ich besonders, nachdem ich herausgefunden habe, dass man mit ActionScript Fenster erschaffen und den Hintergrund bzw. die Zwischenebene zwischen Fensterinhalt und dem durch die Lightbox zu verdeckenden Inhalt transparent gestalten und umfärben kann.
| 01 | /** |
| 02 | Window-Komponente in Library erforderlich! |
| 03 | */ |
| 04 | |
| 05 | import mx.managers.PopUpManager; |
| 06 | import mx.containers.Window; |
| 07 | |
| 08 | System.security.allowDomain("http://christianscholz.com"); |
| 09 | |
| 10 | _global.style.modalTransparency = 90; |
| 11 | |
| 12 | var my_win:MovieClip = PopUpManager.createPopUp(this, Window, true, {closeButton:true, contentPath:"http://christianscholz.com/wordpress/wp-content/blutbad.jpg"}); |
| 13 | |
| 14 | var c:Color = new Color(my_win.modalWindow); |
| 15 | c.setRGB(0x000000); |
| 16 | |
| 17 | var winListener:Object = new Object(); |
| 18 | winListener.click = function(evt_obj:Object) { |
| 19 | my_win.deletePopUp(); |
| 20 | }; |
| 21 | winListener.complete = function(evt_obj:Object) { |
| 22 | my_win.setSize(my_win.content._width, my_win.content._height+25); |
| 23 | }; |
| 24 | my_win.addEventListener("click", winListener); |
| 25 | my_win.addEventListener("complete", winListener); |
Mit diesem Beispielskript, in ein Flash-Dokument eingefügt, wird die Bühne mit 90% opakem Schwarz überzogen (dafür sorgt
_global.style.modalTransparency in Kombination mit der Farbwertzuweisung per
Color-Klasse) und darüber ein Fenster erzeugt, das als Inhalt ein Bild aus meinem Blog trägt.
Das Ergebnis ist nichts Spektakuläres. Außerdem ist die Verwendung der Color-Klasse veraltet. Das aber beiseite gestellt lässt sich sagen, dass hier durchaus ein weiterer Weg gegeben ist, eine Lightbox-Funktion in Flash herzustellen. Am Rande sei noch bemerkt, dass Buttons/Movieclips, die unter der Lightbox liegen, stumm geschaltet werden, also nicht geklickt werden können, während die Lightbox aktiv ist. Dieses Verhalten ist aber in der Regel gewünscht und vorteilhaft.
