アイキャッチ画像
HOME > ウェブデザイン > SWFObject 2.2の組み込み
公開日:2009.12.9
この記事は約3分で読めます。

SWFObject 2.2の組み込み

この記事は最終更新日から9年以上経過しているため現状にそぐわない可能性もあります。

Flashの制作はまだまだ素人でswfの埋め込みにも前々からかなり苦労しています。

そんなときに見つけたのが「SWFObject」。

その頃はver.1.5だったんですが2.2になった現在、簡単なFlashを再度作成することになったので組込方法を調べ直してみました。

SIRIUSレビューイメージ画像

組込のやり方

まずはSWFObject2.2をGoogle Codeからダウンロードします。

現時点ではswfobject_2_2.zip を、そしてHTML埋め込みコードを自動生成させたい場合はswfobject_generator_1_2_html.zipも同時にダウンロードしておきます。

(今回はジェネレーターは必要ないのでダウンロードしません)

実際に使用するのは解凍したフォルダの中の「swfobject.js」のみ。

ただし状況によっては同梱の「expressInstall.swf」を使用する場合もあります。

HTMLの書き方としては、オールマイティっぽい「スタティックパブリッシング」とjava scriptが無効時は機能しない「ダイナミックパブリッシング」の2つがあります。

前者はブラウザを選ばず広くFlashの再生が可能らしいんですがHTMLコードがやや煩雑なので、今回は比較的シンプルなコードの後者(ダイナミックパブリッシング)を使用します。

使用するswfファイル名を仮に「test.swf」とし、swfファイルを表示させるブロックidを「test」とします。

 

<head>~</head>に以下を加筆します。

var のあとの各パラメータは詳しくはわからないのですべて {}; でもいいんですが、menu:'false' は右クリックしたときにメニューを表示させない設定のようなのでお好みで。

allowfullscreen:'true' を付けると全画面表示を許可します。

scale:'noScale' なども可能で、各パラメータを重ねるときはパラメータの最後に「,」を付けます。

expressInstall.swf は、これを サーバーにアップしておくとFlashのバージョンが低いときに自動でアップデートを実行してくれるアプリのようですが省略も可能です。

<body>には以下を加筆します。

極端なことを言えば<div>ブロック内には何も書かなくてもOKです。

Flash playerがインストールされてない環境やSEOを考慮して、上記コメントやFlashのダウンロードサイトをリンクさせるなら書いておいた方がいいぐらいのものでしょう。

Flash表示用 <div> id に幅や高さなどのCSSを設定するとおかしな表示になってしまうので、CSSは設定しないのが無難なようですね。

以上です。

スポンサーリンク

スポンサーリンク

記事はお役にたてましたか?

記事に興味をもっていただけたらソーシャルボタンでの共有お願いします^^

 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓

コメントはお気軽にどうぞ

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

内容に問題なければ下記の「コメントを送信する」ボタンを押してください。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)