Wstawianie Flash na stronę
Z DooBLER wiki
Spis treści |
Wstęp
Co prawda nie jestem zwolennikiem używania Flash'a jako części grafiki na stronie (ale jako np odtwarzacz do filmów, prezentacje lub gierki netowe jest całkiem dobry), jednak czasem jestem zmuszany do jego użycia... (dłuższy temat i nie o to tutaj chodzi).
Problem jaki napotkałem związany jest z patentem jakiejś firmy na automatyczne odpalanie wtyczek w przeglądarkach - w IE7 i Operze, przy tradycyjnym wstawianiu, aby film Flash został uruchomiony musi być on najpierw kliknięty, dodatkowo w IE wokoło obszaru filmu ustawiana jest brzydka ramka.
- <!-- Wstawianie filmu Flash w tradycyjny sposób -->
- <OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
- codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
- WIDTH="550" HEIGHT="400" id="prezentacja">
- <PARAM NAME=movie VALUE="prezentacja.swf">
- <PARAM NAME=quality VALUE=high>
- <PARAM NAME=bgcolor VALUE=#FFFFFF>
- <EMBED src="prezentacja.swf" quality=high bgcolor=#FFFFFF WIDTH="550" HEIGHT="400" NAME="prezentacja"
- TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
- </OBJECT>
Podczas poszukiwania rozwiązania tego problemu natknąłem się na kilka różnych sposobów... Wybrałem SWFObject. I postaram się przedstawić tutaj sposób jego użycia.
SWFObject
SWFObject kożysta z JavaScript do podmieniania elemntu strony (<div>) na film Flash już po załadowniu strony. W przypadku gdy użytkownik nie posiada wtyczki Flash lub ma wyłączoną obsługę JavaScript wyświetlana jest treść alternatywna (oryginalna zawartość podmienianego div'a), może to być np. informacja z linkiem do wtyczi i prośba o włączenie obsługi JavaScript, lub po prostu jakiś statyczny odpowiednik filmiku Flash.
Co pobrać
Pliki potrzebne do zastosowania SWFObject są dostępne na stronie projektu.
Ja podczas pisania tego tekstu używałem wersji SWFObject 2.0
Użucie
Najpierw wprzedstawię kod, a potem go opiszę:
- <html>
- <head>
- <title>Test wstawiania Flash</title>
- <script type="text/javascript" src="js/swfobject.js"></script>
- <script type="text/javascript">
- var flashvars = {};
- var params = {};
- params.play = "true";
- params.menu = "false";
- params.quality = "best";
- params.bgcolor = "#fff";
- params.wmode = "transparent";
- params.allowscriptaccess = "sameDomain";
- var attributes = {};
- attributes.id = "flash1";
- swfobject.embedSWF("http://example.com/flash.swf", "elementflash", "636", "230", "9.0.0", false, flashvars, params, attributes);
- </script>
- <head>
- <body>
- <div id="elementflash">
- Zawartość altenatywna
- </div>
- </body>
- </html>
- Linia 5 - załączenie skryptu SWFObject - w moim przypadku znajduje się w podkatalogu /js/
- Linia 9 - 14 - ustawienie parametrów filmu flash
- Linia 16 - ustawienie identyfikatora wstawianego Flash'a - przydatne przy wstawianiu kilku filmów
- Linia 17 - Uruchomienie funkcji podmieniającej zawartość wybranego elementu na film flash kolejno parametry to: adres do filmu flash, id div'a do którego chcemy wstawić flash, szerokość, wysokość, parametr decydujący o pojawianiu się menu pod prawym przyciskiem i zdeklarowane wcześniej zmienne, parametry i atrybuty.
- Linia 21 - 23 - nasz div, który chcemuy podmienić, musi mieć ustawiony parametr id identyczny jak podaliśmy w linii 17, jego zawartość będzie wyświetlana w przypadku braku u użytkownika wtyczki Flash lub obsługi JavaScript.
Inne
Dodać:
- opis parametrów
Ten artykuł jest tylko zalążkiem.
Możesz pomóc poprzez rozszeszenie tego artykułu.
