スマートフォンやhtml5+CSS3など新技術に四苦八苦。jQuery、AjaxなどJavaScriptも難しいですね。そんなWebに悩む人のネタ帳です。

以前にSWFObject 2.2の利用例を紹介しました。
Flash設置の決定版「swfobject」
上の利用例はswfobjectの公式ドキュメントに掲載されているスタンダードな方法です。一方で、objectタグなどを使用しない、少しスマートな記述方法もあるようです。
swfobject – Project Hosting on Google Code

まず、swfobjectを読み込んで、以下のようにしてswfobjectを実行します。

<script type="text/javascript" src="/js/swfobject.js"></script>
<script type="text/javascript">
	swfobject.embedSWF("/swf/index.swf", "FlashContent", 
		"400", "400", "10", "/swf/expressInstall.swf");
</script>


embedSWFの引数は、左から、設置するswfファイル、置き換えるオブジェクトのID、幅サイズ、縦サイズ、Flashのバージョンとなっています。
そして、以下のようにhtmlで記述した箇所が、Flashに置き換えられます。

<div id="FlashContent"></div>

JavaScript部分を外部化してしまえば、htmlのソースがだいぶすっきりしますね。

また、最近ではAjaxを利用してswfの上にレイヤーを置きたいなどで、パラメータを設定したいときがあります。これも、外部JavaScriptで設定が可能です。

var params = { wmode: 'transparent' };
swfobject.embedSWF("/swf/index.swf", "FlashContent", 
	"400", "400", "10", "/swf/expressInstall.swf", null, params);

wmodeに「transparent」を設定してあげれば、Flashの上にAjaxを使ったドロップダウンメニューやLightboxを重ねることができます。

このエントリーをはてなブックマークに追加

Comment

Comment Form

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Monthly Archives

Search