Wszystko idzie ku dobremu – osadzenie flasha dla wyszukiwarki

Lipiec 1, 2008
Opublikował Krzysztof P.

Przykład możecie zobaczyć w tym miejscu.

Do poprawnego osadzenia flash-a potrzebujemy następujące biblioteki:

jQuery – do pobrania tutaj
SWFObject – do pobrania tutaj

W sekcji head umieszczamy poniższy kod:


<script type="text/javascript" src="js/jquery-1.2.6.pack.js">// < ![CDATA[// ]]></script>
<script type="text/javascript" src="js/swfobject.js">// < ![CDATA[// ]]></script>
<script type="text/javascript">
// < ![CDATA[//
$(function(){
swfobject.embedSWF("bilart.swf", "tutajflash", "550", "400", "8.0.0", "expressInstall.swf");
});
// ]]>
</script>

W kodzie strony umieszczamy poniższy kod:

<!--[if IE]><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="550" height="400"><script>/*< ![endif]-->
<object type="application/x-shockwave-flash" data="bilart.swf" width="550" height="400">
<script type="text/javascript">/**/</script>
<param name="movie" value="bilart.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
</object>

A wszystko opakowujemy w div-a:


<div id="mainContent">

...

</div>

Jak to działa?
Gdy mamy włączony JavaScript, flash jest osadzany za pomocą bilbioteki SWFObject (z opcjonalnym wykorzystaniej jQuery). Gdy zaś JavaScript nie działa, jest zablokowany lub na stronę wchodzi indeksujący crawler, flash jest osadzony w tradycyjny sposób.

Oczywiście w przypadku gdy JS jest zablokowany, a stronę oglądamy w Internet Explorerze, flash-a musimy uruchomić standardowym jednym klikiem, ale myślę, że to stosunkowo niski koszt w porównaniu do jego braku.

Ciekawostką SWFObjecta jest to, że w przypadku, gdy użytkownik ma zainstalowaną niższą wersję flash-a niż wymagana do poprawnego wyświetlenia animacji, nastąpi automatyczna aktualizacja flash-a do najnowszej wersji.

Przykład możecie zobaczyć w tym miejscu.

Jeśli powyższy artykuł spodobał Ci się, zapisz się do kanału RSS i bądź na bieżąco z nowinkami na blogu!