« 人の記憶も75日 | メイン | Javascript による Flash Player のバージョン取得 »

Flash ブログパーツの埋め込み

あとで読む

Flash(swf)ブログパーツをHTML内に配置(デプロイ)する方法として、よく見かけるのは、scriptタグでjavascriptを読み込ませ、動的に(document.writeとかで) objectタグを出力して、その中にembedタグを埋め込む方法である。

scriptタグが許可されていないブログでは概ね objectタグも許可されていないようなので(ウノウラボ Unoh Labs: ブログパーツ貼り付けタグのまとめ+Googleガジェット@はてな 参照)、scriptタグを使ってできるだけシンプルにブログパーツを構成しておいたほうが後々の変更も楽だし、Flash Playerのバージョンチェックもできる。

また、ActiveX コントロールのアクティブ化 の問題もあるので、この理由によっても scriptタグで記述するほうがよいようだ。(参考:Adobe - デベロッパーセンター : ブラウザの更新に備えたアクティブコンテンツ使用Webサイトの準備

で、だいたい動的に生成するコードは、さんざん省略しているが、骨格は下記のような感じ。

<object classid="〜" codebase="〜" width="〜" height="〜" 〜>
<param name="movie" value="〜.swf" />
...
<embed src="〜.swf" width="〜" height="〜" type="application/x-shockwave-flash" 〜 />
</object>

しかし、embedタグは XHTML的に validでないということで、cyano: FlashをXHTMLで表示させるには(embedタグを使わずに表示させるには) のように objectタグのみで配置する方法が考察されている。

<object classid="〜" data="〜.swf" width="〜" height="〜" type="application/x-shockwave-flash">
<param name="movie" value="〜.swf" />
...
(代替表示)
</object>

これによって XHTML validな形で Flash を埋め込むことができる。Flashプレーヤーがインストールされていないか、Flashが無効にされているか、objectタグを認識しないブラウザ(今あるのか。。。)のために代替表示(画像とか)させておくとよい。

上記 objectタグを動的に出力せず、静的に配置する場合は Flash Player のバージョンのチェック及びバージョンによる動作分岐は swf内で行う必要がある。ただし、IEに関しては codebase属性で最低限必要な Flash Player のバージョンを指定することができる(参考:[228711]OBJECT タグの codebase 属性によるバージョン指定の影響についてby Adobeobject要素 by w3g.jp

その他、配置する際に考えること。

Q. 背景を透明にしたい

A. <param name="wmode" value="transparent">
[228617]背景が透明な Flash ムービーを作成する方法

Q. swfへ引数を渡したい

Query Stringとして渡せばよい。URLエンコードすること。(参考:FLASH(*.swf)へ引数をつけて起動したい by hima.chu.jp)例えば、urlに http://groundwalker.com/blog/ を渡すには

hoge.swf?url=http%3A%2F%2Fgroundwalker.com%2Fblog%2F

Q. なんか配置に便利なライブラリないの?

A. こんなのあったけど、未検証。deconcept › SWFObject: Javascript Flash Player detection and embed script

その他関連リンク

関連記事

Trackbacks

Trackback URL:
http://groundwalker.com/mt/gwtb.cgi/337

» ブログへの Flash の貼り付け from 左脳Script
Flash をネタにしているブログなのに、一つもサンプルがないのは非常にまずい・・・と、危機感を感じ Flash Develop で作成されるプロジェクト... [More...]

« 人の記憶も75日 | メイン | Javascript による Flash Player のバージョン取得 »

スポンサー

関連ブログ

あわせて読みたい

関連キーワード

Powered by
Movable Type 3.34

連絡先