Üye Kayıt Üye Giriş

Swfobject ve sayfaya flash eklemek


Swfobject ve sayfaya flash eklemek


SwfObject Nedir?
Swfobject flash dosyalarını(swf) sayfamızda kullanmak için kullandığımız bir yöntemdir.

Flash player bize sayfamızda flash çalıştırmamız için 2 farklı embed yönetimi sunar. bunlardan birincisi markup tabanlıdır, digeri ise swfobject i kullanarak flash’ı sayfamıza basabiliriz. 10Kb dosya büyüklüğünde bir javascript kütüphanesi kullanmaktadır.


swfobject-ve-sayfaya-flash-eklemek-1


Neden SwfObject kullanmak gerekir?
Embed kodunun yarattığı tarayıcı sorunlarından kurtulmanızı sağlar.
Flash player yüklü olmasa bile iç içe alternatif seçenekleri göstermenizi sağlar en sonunda flash player indirmesi için uyarı verilebilir.
flash player sürümünü algılar ve ona göre çalışır.
Ortak bir flash player kullanmak istiyorsak bunu swfobject ile kolayca yapabiliriz.
 

Flash player’ı statik ve dinamik olarak kullanmak
Statik olarak html body içine aşağıdaki gibi yazabiliriz.

</pre>
<object width="780" height="420" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="src" value="myContent.swf" /><embed width="780" height="420" type="application/x-shockwave-flash" src="myContent.swf" /><!--[if !IE]>--> <img src="http://www.yasino.net/wp-includes/js/tinymce/themes/advanced/img/trans.gif" width="780" height="420" data-mce-json="{'video':{},'params':{'src':'myContent.swf'},'name':null,'object_html':' <!--<![endif]--> <br />Alternative content<br /><br /> <!--[if !IE]>--> ','hspace':null,'vspace':null,'align':null,'bgcolor':null}"></img> <!--<![endif]--></object>
<pre>
Dinamik olarak swfObject ile kullanmak

javascript kütüphanemizi sayfamıza ekliyoruz.

<script type="text/javascript" src="swfobject.js"></script>
Daha sonra javascipt kodumuzu yazıyoruz.

<script type="text/javascript">// <![CDATA[
swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
// ]]></script>

bu işlemleri yaptıktan sonra. flash dosyamızı sayfamızda nerede kullanacaksak o kısım için aşağıdaki html kodumuzu kullanıyoruz

1</pre>
<div id="myContent">
Alternatif İçerik</div>
<pre>
Javascript kodumuzu kısaca inceleyelim

1. myContent.swf : flash dosyanızın yer aldığı dosya uzantısı. swf dosyamız bir img klasörünün altında olduğunu düşünecek olursak “img/myContent.swf” olarak yazmamız gerekecektir.

2. myContent : bu bizim sayfa içinde swf dosyasını hangi id ile kullanacağımızı belirler. yukarıdaki html koda baktığımız zaman id=”myContent” yazmaktadır. Eger bu kısımda yazan text ile javascript kodumuzda yazan 2. parametre uyuşmazsa sayfaya swf dosyasını basmaz.

3. 300 : Bu yazan deger sayfamızda kullanılacak olan swf dosyasının genişligini göstetir. px olarak bir ölçümleme birimi ile çalışır.

4. 120 : Bu yazan deger sayfamızda kullanılacak olan swf dosyasının yüksekliğini göstetir. px olarak bir ölçümleme birimi ile çalışır.

Yukarıdaki bilgileri kullanarak en basitinden sayfamızda swf dosyasının çalışmasını sağlayabiliriz.

Şuana kadar ki anlattığım bilgiler sadece basit bir swf dosyasını sayfamıza basmak için kullanabiliriz. Peki biz swf dosyasını biraz daha dinamik hale getirmek istiyoruz. parametreler ile swf dosyanın transparan olmasını, full ekran olma olayını desteklemesini belikide arkaplan rengini belirlemek istiyoruz. veya flashvars ile bir xml dosyanın yolunu burdan vermek istiyoruz. İşte o anda neler yapmak gerekiyor aşağıdaki javascript kodumuzu inceleyebilirsiniz.

<script type="text/javascript">

var flashvars = {};
flashvars.name1 = "hello";
flashvars.name2 = "world";
flashvars.name3 = "foobar";

var params = {};
params.menu = "false";

var attributes = {};
attributes.id = "myDynamicContent";
attributes.name = "myDynamicContent";

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>
bu kodları incelediğimiz zaman biraz daha nasıl kullanıldığına dair daha fazla fikir sahibi olabilirsiniz.

swfobject ile ilgili istege göre kullanılacak olan parametreleri aşağıdan inceleyebilirsiniz

play
loop
menu
quality
scale
salign
wmode
bgcolor
base
swliveconnect
flashvars
devicefont
allowscriptaccess
seamlesstabbing
allowfullscreen
allownetworking

Ders Sahibi;

Yorumlar

Yorum Yapabilmek İçin Üye Girişi Yapmanız Gerekmektedir.

ETİKETLER