Webkrauts

Wir haben noch nicht alle älteren Artikel nachbearbeitet. Das bezieht sich in der Regel nur auf die Codebeispiele, die noch nicht optimal dargestellt werden.

Flash mit FlashReplace einbinden

Möchte man die Unannehmlichkeiten einer traditionellen Flasheinbindung im Internet Explorer umgehen, muss man auf Javascript zurückgreifen. Flashreplace ist dafür die wohl schmalste Variante. Jens Grochtdreis stellt das 2k-kleine Javscript vor.

Bei der Einbindung von Flash gibt es ein paar Feinheiten und Stolpersteine, über die man Bescheid wissen sollte. Der normale, traditionelle Weg der Flasheinbindung ist eine Kombination der Elemente OBJECT, EMBED und PARAM. Der IE benötigt im OBJECT-Element Attribute, die eine Interpretation durch Mozilla unmöglich machen. Deshalb nutzt Mozilla das Element EMBED, das nicht Teil der W3C-Standards ist

Ansätze zur Einbindung via Javascript

Die normale Flasheinbindung ist also in der Gesamtschau invalide. Zudem benötigen wir auf alle Fälle ein Javascript, um das EOLAS-Problem im IE zu umgehen. Es handelt sich hierbei um ein Patent, das Microsofts Flasheinbindung als ActiveX-Objekt betrifft. Ohne den Javascript-Trick muss man erst ein Flashelement durch einen Klick "aktivieren" und kann erst dann einem darin enthaltenen Link folgen. Da man also auf Javascipt bei einem Großteil der Betrachter angewiesen ist lag es nahe, auch die Einbettung via Javascript vorzunehmen. Es gibt hierfür ein paar Ansätze, die alle dem Paradigma des "unobtrusive Javascript" folgen. Die bekanntesten Ansätze sind SWFObject und UFO – für jQuery gibt es ein Plugin.

Die kompakte Alternative: FlashReplace

Robert Nyman hat mit FlashReplace einen sehr kompakten Ansatz als Alternative veröffentlicht. Das Skript hat 2 KB und ist sehr einfach zu nutzen.

Man erstellt erst den alternativen Inhalt – meist ein Ersatzbild, seltener einen Ersatztext – für den Fall, daß kein Flash-Plugin oder eine alte Version installiert ist. Danach wird dieser alternative Inhalt via DOMScripting ersetzt. Dafür muss man FlashReplace entweder innerhalb einer window.load-Lösung aufrufen oder aber das Javascript nach dem alternativen Inhalt einbinden.

Der Aufruf kann folgendermaßen aussehen:

<p id="ersetzmich"><img src="keinflash.gif" alt="" /></p>
<script type="text/javascript">
    FlashReplace.replace("ersetzmich", "flashtest_v5.swf",
                                 "flash-id1", 100, 100, 5);
</script>

Im Funktionsaufruf wird zuerst die ID des zu ersetzenden Containers angegeben. Es muss sich hierbei tatsächlich um eine ID handeln, es kann keine Klasse sein. Es folgen Adresse und Name des Flashfiles und die ID, die der später entstehende Flash-Container haben soll. Danach werden Breite und Höhe sowie die Flash-Version angegeben. Ein Verzicht auf die Versionsangabe aktiviert die Default-Einstellung: Version 7.
Sollten dem Flashfilm ein paar Parameter mitgegeben werden müssen, beispiesweise mode="transparent" oder eine Variable, dann fügt man diese optionalem Parameter in geschweiften Klammern nach der Versionsangabe ein.

FlashReplace.replace("ersetzmich2", "flashtest_v5.swf",
"flash-id2", 100, 100, 5, {wmode: "opaque"});

Der Teufel kann bei der Anwendung eines solchen Skriptes allerdings im Detail stecken. Man muss darauf achten, daß beim Aufruf des Javascriptes das DOM schon geladen ist. Deshalb sollte man den Aufruf am besten wie oben gezeigt nach dem zu ersetzenden Container platzieren. Möchte man das Skript hingegen auslagern oder im Head platzieren, so sollte eine der zahlreichen window.onload-Lösungen genutzt werden.

Update aus aktuellem Anlass: Microsoft hat sich mit dem Patentinhaber geeinigt und angeündigt, daß der IE demnächst keine Aktivierung von Flashinhalten mehr benötigen wird. Das wird allerdings voraussichtlich erst ab April 2008 eintreten. Es steht zu vermuten, daß auch nur der IE7 und folgende Versionen betroffen sein werden.