Flashでブログパーツを作るとき、クリアしなければならないポイントが2つある。
・背景が透明な（背景を透過する）Flashを作る。
・利用者にFlashの簡単な表示方法を提供する。
この「ウィトルウィウス的時計図」は、以前、iGoogle用のガジェットを作ったときの流用なんだけど、ファイルを置いておいたサイトの契約を解除してしまったので使用不可になってしまった。そこで改めて、ブログ用パーツとして作り直した。
以下、その制作過程で気がついたことの備忘録。
●背景が透明な（背景を透過する）Flashを作る方法
まず、背景を透明（背景透過）にするのは、矩形領域（四角く囲った部分）をすべてFlashで使用するようなコンテンツでは、必須ではない。けれども、ブログパーツだけでなく、ウェブ上のコンテンツや、サイドバーに置くガジェットを作成するとき、背景を透過させる方法を覚えておいてソンはない。
作成したFlashの背景を特定の色ではなく、透明にして、ページの背景色を透過させるのは、とても簡単。
Flashをパブリッシュするとき、「ウィンドウズモード」を「標準」から「透明表示」に変えるだけでいい。
パブリッシュしたあと、Flashを表示するためのHTMLを見ると、赤字で表示した部分「<param name="wmode" value="transparent" />」と「wmode="transparent"」の2箇所が追加されていることに気付く。
つまり、「標準」でパブリッシュしたFlashでも、あとから、HTMLにこの文字列を追加すれば、背景が透明なFlashになる。
で、パブリッシュしたときに自動生成される、Flashを表示するためのHTMLは、JavaScriptを使い、FlashPlayerのバージョンを検知したり、ブラウザの種類を特定するため、とても長い。
通常のウェブサイトのFlashコンテンツであろうと、ブログパーツであろうと、基本的には同じなんだけど、自分のブログにFlashのブログパーツを表示するために、長～いHTMLをコピー＆ペーストするのは、誰しも、ごめんこうむりたい。
そこで、現時点で爺が「一番簡単だな」と思える方法が、「<ifarame>タグ」（インライン・フレーム）を使う方法。Flashをパブリッシュしたときに生成される、拡張子が「swf」のファイル（コンパイルされたFlashの実行ファイル）と、それを表示するためのHTMLファイルを、ブログの同一フォルダにアップロードしておく。
●簡単なFlashの表示方法
作成したブログパーツを表示する際には、以下のように記述する。
このHTMLをコピーして、あなたのブログのサイドバーなどに（HTMLの編集モードで）ペーストすれば、「ウィトルウィウス的時計図」が表示されるはず＾＾；
ちなみに、<iframe>タグとは、HTMLの中に枠（囲み）を設け、その中に別のHTMLを表示する機能。
<iframe src="****.html">
ブラウザがiframeに対応していないときの代替テキスト
</iframe>
「****.html」がフレーム内に表示するHTML文書で、タグに挟まれた部分は、代替テキストなので、通常は表示されない。
Internet Explorer 3.0以降、Netscape 6.0以降のブラウザなら、インラインフレームに対応しているので、パソコンで閲覧するのであれば、ほとんどの場合、問題は生じないと思うが、モバイル環境を含めると、爺には、わからない＞＜；
●iframeで背景透過を使うときの注意点
背景透過のFlashを作成するには、パブリッシュするときに「ウィンドウズモード」を「透明表示」にするだけでいいと述べた。インラインフレームで背景を透明にするには、「iframe」の属性に「allowtransparency="true"」を加える。しかし、これだけでは、透明にならないという、思わぬ落とし穴がある。<iframe>タグ内で表示するHTML文書の<body>タグに以下の一文を追加する必要があるのだ。
・元のHTML
<body bgcolor="#ffffff">
・修正したHTML
<body bgcolor="#ffffff" style="background-color: transparent;">
これは、HTMLのBODYに「背景色に透過を使っていいですよ」というお墨付きを与えるおまじない（本当はスタイルシートに書いておけばいいんだろうけれど…）。Flashを「透明表示」にして、パブリッシュしても、この部分までは自動生成してくれないので、iframeでFlashを表示するときには、HTMLを手書きで修正する必要があるのら。これに気付かないと「なんで～？」ということになる＾＾；
というわけで、もうひとつ「おまけ」のブログパーツ。
●ブログパーツ「今日のバイオリズム」
これも、以前、作成したものをブログパーツ用に作り直したもの。中心の▼のところが、今日のバイオリズムで、前後2週間分を表示している。以下のHTMLをあなたのブログにコピー＆ペーストすれば（もちろん、HTML編集モードで）、ブログ本文中や、ブログのサイドバーに貼り付けることができるはず＾＾；
Flashの「代替イメージ」表示についても、書いておきたかったけれど、長くなるので、別エントリで……。